在 UIStackView 中按比例填充
Fill Proportionally in UIStackView
我正在使用 Storyboard 创建一个布局,该布局由底部的 UITableView 和 UIView 组成。我正在使用 UIStackView 并垂直播放它们。我希望 UITableView 占高度的 80%,而 UIView(页脚)占 20%。我正在使用 UIStackView 的 Fill Proportionally 选项,甚至在 Xcode 预览中看起来不错,但是当应用程序为 运行 时,它无法正确呈现。这是我想要的样子:
这是 运行 时的样子:
想法?
您需要设置一个明确的约束,使 tableView.height 比您的视图大小大 4 倍。它们没有固有的内容大小,因此 stackView
不“知道”如何正确填充 space.
此外,将分发模式设置为 .fill
,因为 .fillProportionally
使用固有内容大小来确定适当的分发(摘自 docs):
case fillProportionally
A layout where the stack view resizes its arranged views so that they fill the available space along the stack view’s axis. Views are resized proportionally based on their intrinsic content size along the stack view’s axis.
使用约束我们明确设置大小,而不是使用固有内容大小 - 因此 .fillProportionally
不起作用。我假设在这种情况下 stackView
直接使用 view.intrinsicContentSize
返回的值。但是,约束不会改变 view.intrinsicContentSize
.
如果你想用代码来做,你可以这样做:
tableView.heightAnchor.constraint(equalTo: myView.heightAnchor, multiplier: 4).isActive = true
在故事板中,控制从 tableView
拖动到 myView
和 select Equal Heights
:
然后select创建约束并设置适当的乘数:
在故事板的文档大纲中 control-drag 从顶视图到堆栈视图与 select 等高。现在转到 Size Inspector,您应该会看到约束。双击它并将乘数设置为 0.2。然后更新帧。
保持堆栈视图分布为填充。
控制从 view2 拖动到 view1 以创建等高约束。
转到约束并将乘数设置为 0.2。
我正在使用 Storyboard 创建一个布局,该布局由底部的 UITableView 和 UIView 组成。我正在使用 UIStackView 并垂直播放它们。我希望 UITableView 占高度的 80%,而 UIView(页脚)占 20%。我正在使用 UIStackView 的 Fill Proportionally 选项,甚至在 Xcode 预览中看起来不错,但是当应用程序为 运行 时,它无法正确呈现。这是我想要的样子:
这是 运行 时的样子:
想法?
您需要设置一个明确的约束,使 tableView.height 比您的视图大小大 4 倍。它们没有固有的内容大小,因此 stackView
不“知道”如何正确填充 space.
此外,将分发模式设置为 .fill
,因为 .fillProportionally
使用固有内容大小来确定适当的分发(摘自 docs):
case fillProportionally
A layout where the stack view resizes its arranged views so that they fill the available space along the stack view’s axis. Views are resized proportionally based on their intrinsic content size along the stack view’s axis.
使用约束我们明确设置大小,而不是使用固有内容大小 - 因此 .fillProportionally
不起作用。我假设在这种情况下 stackView
直接使用 view.intrinsicContentSize
返回的值。但是,约束不会改变 view.intrinsicContentSize
.
如果你想用代码来做,你可以这样做:
tableView.heightAnchor.constraint(equalTo: myView.heightAnchor, multiplier: 4).isActive = true
在故事板中,控制从 tableView
拖动到 myView
和 select Equal Heights
:
然后select创建约束并设置适当的乘数:
在故事板的文档大纲中 control-drag 从顶视图到堆栈视图与 select 等高。现在转到 Size Inspector,您应该会看到约束。双击它并将乘数设置为 0.2。然后更新帧。
保持堆栈视图分布为填充。
控制从 view2 拖动到 view1 以创建等高约束。
转到约束并将乘数设置为 0.2。