向 stackView 添加標簽時，將添加 4 個而不是 5 個標簽。Swift

Question

我需要根據符號數組中的對象數量在屏幕上顯示標簽，數組中有 5 個對象，屏幕上有 4 個標簽（如屏幕截圖所示），有什么問題？ 代碼附在下面

class ViewController: UIViewController {

    var symbols = ["1", "2","3", "4", "5"]
    
    let mySpacing: CGFloat = 5.0

    let widthLabelInFormula = 50

    let formulaStackView = UIStackView()

    var symbolLabels: [UILabel] = []

    override func viewDidLoad() {
        super.viewDidLoad()
        
        let widthFormula: CGFloat = CGFloat(50 * symbols.count - symbols.count * 50)
        formulaStackView.axis = .horizontal
        formulaStackView.alignment = .fill
        formulaStackView.distribution = .fillEqually
        formulaStackView.spacing = mySpacing
        formulaStackView.backgroundColor = #colorLiteral(red: 1, green: 1, blue: 1, alpha: 1)
        
        view.addSubview(formulaStackView)
    
        // add constraints
        formulaStackView.translatesAutoresizingMaskIntoConstraints = false
        formulaStackView.heightAnchor.constraint(equalToConstant: 50).isActive = true
        formulaStackView.widthAnchor.constraint(equalToConstant: widthFormula).isActive = true
        formulaStackView.topAnchor.constraint(equalTo: view.topAnchor, constant: 250).isActive = true
    
        
        addLabels(formulaStackView: formulaStackView)
    }

    func addLabels(formulaStackView: UIStackView) {
        for _ in 0 ..< symbols.count {
            addLabel(formulaStackView: formulaStackView)
        }
        print(symbolLabels.count) // 5
    }

    func addLabel(formulaStackView: UIStackView) {
        let symbolLabel = UILabel()
        symbolLabel.backgroundColor = #colorLiteral(red: 0.09019608051, green: 0, blue: 0.3019607961, alpha: 1)
        symbolLabel.textColor = #colorLiteral(red: 1.0, green: 1.0, blue: 1.0, alpha: 1.0)
        symbolLabel.textAlignment = .center
        symbolLabel.font = UIFont.systemFont(ofSize: 20)
        symbolLabel.text = "?"
        
        // add constraints
        symbolLabel.heightAnchor.constraint(equalToConstant: 50).isActive = true
        symbolLabel.widthAnchor.constraint(equalToConstant: 50).isActive = true
        symbolLabel.translatesAutoresizingMaskIntoConstraints = false
    
        
        symbolLabels.append(symbolLabel)
        formulaStackView.addArrangedSubview(symbolLabel)
    }
}

Answer 1

這里的問題是您在此行中將堆棧視圖的寬度設置為零：

let widthFormula: CGFloat = CGFloat(50 * symbols.count - symbols.count * 50) // 0

您實際上可以刪除上面的行和這一行：

formulaStackView.widthAnchor.constraint(equalToConstant: widthFormula).isActive = true

因為 UIKit 可以自動設置。

完成代碼

class ViewController: UIViewController {
    var symbols = ["1", "2","3", "4", "5"]

    let mySpacing: CGFloat = 5.0

    let widthLabelInFormula = 50

    let formulaStackView = UIStackView()

    var symbolLabels: [UILabel] = []

    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .white
//        let widthFormula: CGFloat = CGFloat(50 * symbols.count - symbols.count * 50)
        formulaStackView.axis = .horizontal
        formulaStackView.alignment = .fill
        formulaStackView.distribution = .fillEqually
        formulaStackView.spacing = mySpacing
        formulaStackView.backgroundColor = #colorLiteral(red: 1, green: 1, blue: 1, alpha: 1)
        
        view.addSubview(formulaStackView)

        // add constraints
        formulaStackView.translatesAutoresizingMaskIntoConstraints = false
        formulaStackView.heightAnchor.constraint(equalToConstant: 50).isActive = true
//        formulaStackView.widthAnchor.constraint(equalToConstant: widthFormula).isActive = true
        formulaStackView.topAnchor.constraint(equalTo: view.topAnchor, constant: 250).isActive = true

        
        addLabels(formulaStackView: formulaStackView)
    }

    func addLabels(formulaStackView: UIStackView) {
        for _ in 0 ..< symbols.count {
            addLabel(formulaStackView: formulaStackView)
        }
        print(symbolLabels.count) // 5
    }

    func addLabel(formulaStackView: UIStackView) {
        let symbolLabel = UILabel()
        symbolLabel.translatesAutoresizingMaskIntoConstraints = false
        symbolLabel.backgroundColor = #colorLiteral(red: 0.09019608051, green: 0, blue: 0.3019607961, alpha: 1)
        symbolLabel.textColor = #colorLiteral(red: 1.0, green: 1.0, blue: 1.0, alpha: 1.0)
        symbolLabel.textAlignment = .center
        symbolLabel.font = UIFont.systemFont(ofSize: 20)
        symbolLabel.text = "?"
        
        // add constraints
        symbolLabel.heightAnchor.constraint(equalToConstant: 50).isActive = true
        symbolLabel.widthAnchor.constraint(equalToConstant: 50).isActive = true

        
        symbolLabels.append(symbolLabel)
        formulaStackView.addArrangedSubview(symbolLabel)
    }
}