左对齐的水平堆栈视图和顶部对齐的垂直堆栈视图 [英] Left aligned horizontal stackview and top aligned vertical stackview

问题描述

我有两个 StackView，一个是水平的，另一个是垂直的.

I have two StackView, one of which is horizontal and another vertical.

对于水平 StackView，我希望项目向左对齐并向右增长.

For the horizontal StackView, I want the items to be aligned to the left and grow toward the right.

对于垂直 StackView，我希望项目与顶部对齐并向下增长.例如，顶部项目的位置永远不会改变，但如果添加另一个项目，堆栈视图会向下扩展.

For the vertical StackView, I want the items to be aligned to the top and grow downward. For example the position of the top item would never change but the stackview expands down if another item is added.

我在完成此操作时遇到问题，例如使用我的水平 StackView，如果我有两个 40x40 的项目，它们会出于某种原因显示整个屏幕宽度，并且我尝试了大量不同的分布变化，对齐和约束.

I'm having trouble accomplishing this, for example with my horizontal StackView, if I have two items 40x40, they will example the entire width of screen for some reason and I've tried a whole slew of different variations of distribution, alignment and constraints.

对于我的垂直 StackView，如果我添加两个项目，我的第一个项目将向上移动，第二个项目将在下方，因此中心现在位于两者之间，而不是第一个项目保持静止，第二个项目位于其下方.

For my vertical StackView, if I add two items, my first item will move up and the second item will go underneath, so the center is now between the two instead of the first item staying still and the second going underneath it.

我不知道我在这里做错了什么，以及如何获取 StackViews，其中第一个项目的大小正确，到位，未来的项目跟随它，向右或向下扩展.

I can't figure out what I'm doing wrong here and how to just get StackViews where the first item is sized correctly, in place, and future items follow it, expanding either rightwards or downwards.

推荐答案

Vertical

1- 将带有顶部、前导和尾随约束的 UIStackView 拖到 superView

1- Drag a UIStackView with top , leading and trailing constraints to the superView

2- 拖动其中的任何视图并给它一个高度约束

2- Drag any view inside it and give it a height constraint

用于水平

1- 将带有顶部、前导和高度约束的 UIStackView 拖到 superView

1- Drag a UIStackView with top , leading and height constraints to the superView

2- 拖动其中的任何视图并为其设置宽度约束

2- Drag any view inside it and give it a width constraint

注意:将分布设置为fill

这篇关于左对齐的水平堆栈视图和顶部对齐的垂直堆栈视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！