【问题标题】:How to set up autolayout constraints for vertical Stack View in Scroll View如何在滚动视图中为垂直堆栈视图设置自动布局约束
【发布时间】:2019-05-13 08:06:17
【问题描述】:

我有以下设置,但无法正常使用自动布局:

Scroll View, which should take the whole screen
 |_ Stack View, which should take the whole size of the Scroll View
     |_ View 1 with a predefined height of 200
     |_ View 2 with a flexible height defined by content, but minimum 300
     |_ View 3 with a predefined  height of 500

我尝试了以下方法:

  1. 滚动视图
    • 将顶部、底部、前导和尾随对齐设置为超级视图
  2. 堆栈视图
    • 将顶部、底部、前导和尾随对齐设置为超级视图(滚动视图)
    • 为超级视图设置等宽(滚动视图)
    • 为超级视图(滚动视图)设置相等的高度,优先级为 250
  3. 堆栈视图中的 3 个视图
    • 为 View1 定义 height = 200,为 View3 定义 height = 500
    • 为 View2 定义高度 >= 300

我得到:

  • IB 中的错误:View2 的不等式约束歧义
  • 如果我启动并滚动,我会在顶部和底部获得额外的间距(请参阅模拟器屏幕截图中顶部和底部的红色区域)

请看截图:

【问题讨论】:

  • 我建议你使用tableView
  • 你能检查你的 UIStackView 的属性并添加“分布”吗?如果分布不是“填充”(这是您实际应该选择的),您所解释的可能会发生
  • @Renaud:感谢您的提示。我现在将分布更改为“按比例填充”,约束错误消失了,3 个视图也是从顶部堆叠的,IB 之间没有空间,就像屏幕截图上一样。现在我只剩下滚动视图上方和下方的空格,但我认为这就是 iOS 处理带有缺口的 iPhone X 的方式?
  • 按比例填充可能不是一个正确的选择:如果中心视图增大,顶部和底部视图将缩小,因此由约束定义的顶部/中间/底部视图之间的高度比将为受到尊重,但绝对尺寸不会。对于滚动视图上下的空间,可以通过contentInsetAdjustmentBehavior UIScrollView 的属性进行调整。问题是您的 UIStackView 高度约束无法得到尊重:由于调整了内容插图,它被破坏了,并且您的中间视图只剩下一个最小约束来定义其高度。
  • @Renaud 实际上我试过了,并且按比例填充它可以工作。发生的情况是 Stack View 和 Scroll View 的高度也增加了,因为 Stack View 的高度约束等于 Scroll View 的高度但优先级较低,因此 Stack View 的内容将定义高度。

标签: swift uiscrollview autolayout uistackview


【解决方案1】:

将顶部、底部、前导和尾随对齐更改为 SafeArea

因为内容视图始终在 SafeArea 内。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2021-06-24
    • 1970-01-01
    • 1970-01-01
    • 2017-01-26
    • 2017-10-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多