具有动态内容的iOS Stackview自动布局问题

如何解决具有动态内容的iOS Stackview自动布局问题

我正在尝试将UIStackView与动态内容一起使用在我的项目中。 stackview固定在容器视图的开头和结尾。我为什么要固定它？因为否则Xcode会抱怨我必须指定宽度或X位置。但这也许不是正确的方法-让我知道。堆栈视图当前配置有：

alignment：居中（我也尝试过“ Filled”）
分布：等距

无论如何，stackview本身的内容是从XIB文件创建的，该文件被扩展为自定义UIView。这种作品，但是我在布局方面遇到了几个问题：

当stackview中只有少量项目时，它们将稀疏分布。理想情况下，我希望UIView（带有绿色区域的橙色按钮）调整为尽可能大的尺寸，以填补这些空白
当stackview中有很多项目时，它们当前会彼此堆叠。这是一个问题。应该将各个UIView调整为最大尺寸，以使其可以水平地放入UIStackview中。

我将UIView添加到stackview的操作如下：

labelStackView.arrangedSubviews.forEach { (view) in
 view.removeFromSuperview()
}

for (index,character) in model.modelName.enumerated() {
     // CharacterPlaceholder extends UIView
     let characterPlaceHolder = CharacterPlaceholder()
     ...
     labelStackView.addArrangedSubview(characterPlaceHolder)
}

而CharacterPlaceholder大致如下所示

class CharacterPlaceholder: UIView {
    override init(frame: CGRect) {
        super.init(frame: frame)
        customInit()
    }
    
    required init?(coder: NSCoder) {
        super.init(coder: coder)
        customInit()
    }

    private func customInit(){           
        let nib = UINib(nibName: "CharacterPlaceholder",bundle: nil)
       
               if let view = nib.instantiate(withOwner: self,options: nil).first as? UIView {
                   addSubview(view)
                   
                   view.frame = self.bounds
               }
    }

我已将项目上传到我的github帐户： https://github.com/alexwibowo/Flipcard

知道我做错了什么吗？我应该在开始时（或在屏幕旋转期间）抓住屏幕尺寸，然后手动计算按钮所需的宽度吗？这似乎很痛苦，而且非常手动。我希望可以在这里使用一些自动布局的魔术。

预先感谢您的帮助！

编辑：我认为我需要对分布使用“均等填充”，以便各个字母块具有相同的大小。而且，以便将它们限制在可用的stackview空间中。但是，现在它们仍然可以重叠。

解决方法

好吧..我想出了一种方法。首先，正如我已经提到的，我需要将分布设置为“均等填充”，以使stackview中的每个视图大小均等。但是仅靠这样做是不够的。我需要获取屏幕尺寸。即通过

view.frame.width

然后，当我扩展xib文件时，我需要使用简单的数学方法手动调整其大小。例如：

let viewWidth = view.frame.width
let numberOfCharacters = model.modelName.count
let widthOfEach = Int(viewWidth) / numberOfCharacters

然后调整大小部分：

characterPlaceHolder.widthConstraint.constant = widthOfEachIncludingMargin

widthConstraint是我在characterPlaceHolder视图上设置的出口。