UIStackView內不同寬度的水平居中視圖

Question

我想設置一個UIViewStack，以便它將兩個視圖居中，即使它們有不同的寬度。 這是一個例子：

是否可以使用UIStackView實現此類配置？ 我似乎無法弄明白！

任何幫助，將不勝感激。

Answer 1

您應該使用嵌套的StackView 。 首先在Horizontal StackView嵌入View1和Horizontal StackView 。 按比例填充對齊屬性中心和分布。 然后將Horizontal StackView嵌入Vertical Stackview 。 這里我附上了我的演示截圖：

Answer 2

不，你不能。 來自蘋果的Doc

堆棧視圖使用“自動布局”來定位和調整其排列的視圖大小。 堆棧視圖將第一個和最后一個排列的視圖與其沿着堆棧軸的邊緣對齊。 In a horizontal stack, this means the first arranged view's leading edge is pinned to the stack's leading edge, and the last arranged view's trailing edge is pinned to the stack's trailing edge.

您可以使用約束 。

Answer 3

在那里添加視圖后，我可以使UIStackView自動增長寬度

1. 創建UIViewController並讓UIStackView成為那里的中心
2. Constraint StackView.leading Priority設置為250以避免xib中的警告問題

3. 代碼

   class StackSampleViewController：UIViewController {

    @IBOutlet weak var stackView: UIStackView! //Keep center auto grow with subviews @IBAction func touchUpAdd(_ sender: Any) { let view = UIView() view.translatesAutoresizingMaskIntoConstraints = false view.heightAnchor.constraint(equalToConstant: 20.0).isActive = true if (stackView.subviews.count % 2) == 0 { view.widthAnchor.constraint(equalToConstant: 100).isActive = true view.backgroundColor = .black } else { view.widthAnchor.constraint(equalToConstant: 50).isActive = true view.backgroundColor = .red } stackView.addArrangedSubview(view) } 

   }

4. 結果

Answer 4

是的，您可以，首先創建主垂直堆棧視圖並設置對齊中心和分布填充。 然后在主堆棧中創建第二個水平堆棧視圖，並設置對齊和分配填充。 添加要添加的最后一個元素。

第一個棧視圖：

第二個棧視圖：