没有以编程方式添加到 UIStackView 的元素？

Question

我试图在 Live playground 中制作一个排序可视化工具，所以我创建了一个堆栈视图，但是当我尝试添加 UIView（作为该可视化工具中的棒）时，它们没有添加到我的 stackView 中，下面是我的代码它很大，但您对 mainStackview 部分感兴趣只是因为那是我想添加的 stackView sticks(UIView)，还有 buildStartingArray() 函数（它用于添加 UIViews）

public class HomeViewController:UIViewController{

    let stackView:UIStackView = {
       let st = UIStackView()
        st.axis = .horizontal
        st.alignment = .center
        st.distribution = .fill
//        st.backgroundColor = .cyan
        st.layer.shadowColor = UIColor.gray.cgColor
        st.layer.shadowOffset = .zero
        st.layer.shadowRadius = 5
        st.layer.shadowOpacity = 1
        st.spacing = 10
        st.translatesAutoresizingMaskIntoConstraints = false
        
       return st
    }()
    let generateButton:UIButton = {
       let btn = UIButton()
        btn.setTitle("Generate Array", for: .normal)
        btn.backgroundColor = UIColor(red: 0.92, green: 0.30, blue: 0.29, alpha: 1.00)
        btn.setTitleColor(.white, for: .normal)
        btn.titleLabel?.font = UIFont.boldSystemFont(ofSize: 20)
        btn.layer.cornerRadius = 10
        btn.layer.masksToBounds = true
        btn.heightAnchor.constraint(equalToConstant: 38).isActive = true
        btn.translatesAutoresizingMaskIntoConstraints = false
        return btn
    }()
    let BubbleSort:UIButton = {
       let btn = UIButton()
        btn.setTitle("BubbleSort", for: .normal)
        btn.backgroundColor = UIColor(red: 0.41, green: 0.43, blue: 0.88, alpha: 1.00)
        btn.setTitleColor(.white, for: .normal)
        btn.titleLabel?.font = UIFont.italicSystemFont(ofSize: 20)
        btn.layer.cornerRadius = 10
        btn.layer.masksToBounds = true
        btn.heightAnchor.constraint(equalToConstant: 38).isActive = true
        btn.translatesAutoresizingMaskIntoConstraints = false
        return btn
    }()
    let MergeSort:UIButton = {
       let btn = UIButton()
        btn.setTitle("MergeSort", for: .normal)
        btn.backgroundColor = UIColor(red: 0.10, green: 0.16, blue: 0.34, alpha: 1.00)
        btn.setTitleColor(.white, for: .normal)
        btn.titleLabel?.font = UIFont.italicSystemFont(ofSize: 20)
        btn.layer.cornerRadius = 10
        btn.layer.masksToBounds = true
        btn.heightAnchor.constraint(equalToConstant: 38).isActive = true
        btn.translatesAutoresizingMaskIntoConstraints = false
        return btn
    }()
    let InsertionSort:UIButton = {
       let btn = UIButton()
        btn.setTitle("InsertionSort", for: .normal)
        btn.backgroundColor = UIColor(red: 0.19, green: 0.22, blue: 0.32, alpha: 1.00)
        btn.setTitleColor(.white, for: .normal)
        btn.titleLabel?.font = UIFont.italicSystemFont(ofSize: 20)
        btn.layer.cornerRadius = 10
        btn.layer.masksToBounds = true
        btn.heightAnchor.constraint(equalToConstant: 38).isActive = true
        btn.translatesAutoresizingMaskIntoConstraints = false
        return btn
    }()
    let SelectionSort:UIButton = {
       let btn = UIButton()
        btn.setTitle("SelectionSort", for: .normal)
        btn.backgroundColor = UIColor(red: 0.51, green: 0.20, blue: 0.44, alpha: 1.00)
        btn.setTitleColor(.white, for: .normal)
        btn.titleLabel?.font = UIFont.italicSystemFont(ofSize: 20)
        btn.layer.cornerRadius = 10
        btn.layer.masksToBounds = true
        btn.heightAnchor.constraint(equalToConstant: 38).isActive = true
        btn.translatesAutoresizingMaskIntoConstraints = false
        return btn
    }()
    let mainStackView:UIStackView = {
        let st = UIStackView()
        st.backgroundColor = .gray
        st.axis = .horizontal
        st.distribution = .fillEqually
        st.alignment = .firstBaseline
        st.spacing = 1
        st.translatesAutoresizingMaskIntoConstraints = false
        return st
    }()
    let baseView:UIView = {
        let vw = UIView()
        vw.backgroundColor = UIColor(red: 0.07, green: 0.54, blue: 0.65, alpha: 1.00)
        vw.translatesAutoresizingMaskIntoConstraints = false
        vw.layer.cornerRadius = 3
        vw.layer.masksToBounds = true
        vw.heightAnchor.constraint(equalToConstant: 15).isActive = true
        return vw
    }()
    public override   func viewDidLoad() {
          view.addSubview(mainStackView)
          view.addSubview(stackView)
          view.addSubview(baseView)
        edgesForExtendedLayout = []
        stackView.addArrangedSubview(generateButton)
        stackView.addArrangedSubview(BubbleSort)
        stackView.addArrangedSubview(MergeSort)
        stackView.addArrangedSubview(InsertionSort)
        stackView.addArrangedSubview(SelectionSort)
        
        stackView.topAnchor.constraint(equalTo: view.topAnchor).isActive = true
        stackView.leftAnchor.constraint(equalTo: view.leftAnchor).isActive = true
        stackView.rightAnchor.constraint(equalTo: view.rightAnchor).isActive = true
        stackView.heightAnchor.constraint(equalToConstant: 50).isActive = true
        
        baseView.bottomAnchor.constraint(equalTo: view.bottomAnchor,constant: -2).isActive = true
        baseView.leftAnchor.constraint(equalTo: view.leftAnchor,constant: 5).isActive = true
        baseView.rightAnchor.constraint(equalTo: view.rightAnchor,constant: -5).isActive = true

         mainStackView.topAnchor.constraint(equalTo: stackView.bottomAnchor, constant: 5).isActive = true
        mainStackView.leftAnchor.constraint(equalTo: view.leftAnchor, constant: 5).isActive = true
        mainStackView.rightAnchor.constraint(equalTo: view.rightAnchor, constant: -5).isActive = true
        mainStackView.bottomAnchor.constraint(equalTo: baseView.topAnchor, constant: -5).isActive = true
        setButtons()
        builStartingArray()

    }

   func setButtons(){
        generateButton.addTarget(self, action: #selector(generatePressed), for: .touchUpInside)
        BubbleSort.addTarget(self, action: #selector(bubbleSort), for: .touchUpInside)
        MergeSort.addTarget(self, action: #selector(mergeSort), for: .touchUpInside)
        InsertionSort.addTarget(self, action: #selector(insertionSort), for: .touchUpInside)
        SelectionSort.addTarget(self, action: #selector(selectionSort), for: .touchUpInside)
    }
    func builStartingArray(){
        let viewStick:UIView = {
           let v = UIView()
            v.backgroundColor = .red
            v.translatesAutoresizingMaskIntoConstraints = false
            v.frame.size = CGSize(width: 50, height: 150)
            return v
        }()
        let viewStick2:UIView = {
           let v = UIView()
            v.backgroundColor = .red
            v.translatesAutoresizingMaskIntoConstraints = false
            v.frame.size = CGSize(width: 50, height: 150)
            return v
        }()
        mainStackView.addArrangedSubview(viewStick)
        mainStackView.addArrangedSubview(viewStick2)
    }
}

问题是我在 buildStartingArray() 函数中添加的 UIView 没有显示，并且现在我只添加了 2 个视图，但将来我计划在 mainStackView 中添加 30-35，

我希望这些 UIView 看起来像条形图，而 mainStackView 是我的图

这是当前输出 mainStackView 是灰色背景的

Answer 1

使主 stackView 底部对齐

您可以尝试为 mainStack 子视图添加高度，例如

v.translatesAutoresizingMaskIntoConstraints = false
v.heightAnchor.constraint(equalToConstant: 150).isActive = true

在

func builStartingArray(){
    let viewStick:UIView = {
       let v = UIView()
        v.backgroundColor = .red
        v.translatesAutoresizingMaskIntoConstraints = false
        v.heightAnchor.constraint(equalToConstant: 150).isActive = true
        return v
    }()
    let viewStick2:UIView = {
       let v = UIView()
        v.backgroundColor = .red
        v.translatesAutoresizingMaskIntoConstraints = false
        v.heightAnchor.constraint(equalToConstant: 150).isActive = true
        return v
    }()
    mainStackView.addArrangedSubview(viewStick)
    mainStackView.addArrangedSubview(viewStick2)
}

所有代码

import UIKit

class ViewController:UIViewController{

   let stackView:UIStackView = {
       let st = UIStackView()
        st.axis = .horizontal
        st.alignment = .center
        st.distribution = .fill
//        st.backgroundColor = .cyan
        st.layer.shadowColor = UIColor.gray.cgColor
        st.layer.shadowOffset = .zero
        st.layer.shadowRadius = 5
        st.layer.shadowOpacity = 1
        st.spacing = 10
        st.translatesAutoresizingMaskIntoConstraints = false
        
       return st
    }()
    let generateButton:UIButton = {
       let btn = UIButton()
        btn.setTitle("Generate Array", for: .normal)
        btn.backgroundColor = UIColor(red: 0.92, green: 0.30, blue: 0.29, alpha: 1.00)
        btn.setTitleColor(.white, for: .normal)
        btn.titleLabel?.font = UIFont.boldSystemFont(ofSize: 20)
        btn.layer.cornerRadius = 10
        btn.layer.masksToBounds = true
        btn.heightAnchor.constraint(equalToConstant: 38).isActive = true
        btn.translatesAutoresizingMaskIntoConstraints = false
        return btn
    }()
    let BubbleSort:UIButton = {
       let btn = UIButton()
        btn.setTitle("BubbleSort", for: .normal)
        btn.backgroundColor = UIColor(red: 0.41, green: 0.43, blue: 0.88, alpha: 1.00)
        btn.setTitleColor(.white, for: .normal)
        btn.titleLabel?.font = UIFont.italicSystemFont(ofSize: 20)
        btn.layer.cornerRadius = 10
        btn.layer.masksToBounds = true
        btn.heightAnchor.constraint(equalToConstant: 38).isActive = true
        btn.translatesAutoresizingMaskIntoConstraints = false
        return btn
    }()
    let MergeSort:UIButton = {
       let btn = UIButton()
        btn.setTitle("MergeSort", for: .normal)
        btn.backgroundColor = UIColor(red: 0.10, green: 0.16, blue: 0.34, alpha: 1.00)
        btn.setTitleColor(.white, for: .normal)
        btn.titleLabel?.font = UIFont.italicSystemFont(ofSize: 20)
        btn.layer.cornerRadius = 10
        btn.layer.masksToBounds = true
        btn.heightAnchor.constraint(equalToConstant: 38).isActive = true
        btn.translatesAutoresizingMaskIntoConstraints = false
        return btn
    }()
    let InsertionSort:UIButton = {
       let btn = UIButton()
        btn.setTitle("InsertionSort", for: .normal)
        btn.backgroundColor = UIColor(red: 0.19, green: 0.22, blue: 0.32, alpha: 1.00)
        btn.setTitleColor(.white, for: .normal)
        btn.titleLabel?.font = UIFont.italicSystemFont(ofSize: 20)
        btn.layer.cornerRadius = 10
        btn.layer.masksToBounds = true
        btn.heightAnchor.constraint(equalToConstant: 38).isActive = true
        btn.translatesAutoresizingMaskIntoConstraints = false
        return btn
    }()
    let SelectionSort:UIButton = {
       let btn = UIButton()
        btn.setTitle("SelectionSort", for: .normal)
        btn.backgroundColor = UIColor(red: 0.51, green: 0.20, blue: 0.44, alpha: 1.00)
        btn.setTitleColor(.white, for: .normal)
        btn.titleLabel?.font = UIFont.italicSystemFont(ofSize: 20)
        btn.layer.cornerRadius = 10
        btn.layer.masksToBounds = true
        btn.heightAnchor.constraint(equalToConstant: 38).isActive = true
        btn.translatesAutoresizingMaskIntoConstraints = false
        return btn
    }()
    let mainStackView:UIStackView = {
        let st = UIStackView()
        st.backgroundColor = .gray
        st.axis = .horizontal
        st.distribution = .fillEqually
        st.alignment = .top
        st.spacing = 1
        st.translatesAutoresizingMaskIntoConstraints = false
        return st
    }()
    let baseView:UIView = {
        let vw = UIView()
        vw.backgroundColor = UIColor(red: 0.07, green: 0.54, blue: 0.65, alpha: 1.00)
        vw.translatesAutoresizingMaskIntoConstraints = false
        vw.layer.cornerRadius = 3
        vw.layer.masksToBounds = true
        return vw
    }()
    public override   func viewDidLoad() {
          view.addSubview(mainStackView)
          view.addSubview(stackView)
          view.addSubview(baseView)
        edgesForExtendedLayout = []
        stackView.addArrangedSubview(generateButton)
        stackView.addArrangedSubview(BubbleSort)
        stackView.addArrangedSubview(MergeSort)
        stackView.addArrangedSubview(InsertionSort)
        stackView.addArrangedSubview(SelectionSort)
        
        stackView.topAnchor.constraint(equalTo: view.topAnchor).isActive = true
        stackView.leftAnchor.constraint(equalTo: view.leftAnchor).isActive = true
        stackView.rightAnchor.constraint(equalTo: view.rightAnchor).isActive = true
        stackView.heightAnchor.constraint(equalToConstant: 50).isActive = true
        
        baseView.bottomAnchor.constraint(equalTo: view.bottomAnchor,constant: -2).isActive = true
        baseView.leftAnchor.constraint(equalTo: view.leftAnchor,constant: 5).isActive = true
        baseView.rightAnchor.constraint(equalTo: view.rightAnchor,constant: -5).isActive = true
        baseView.heightAnchor.constraint(equalToConstant: 15).isActive = true
        
        mainStackView.topAnchor.constraint(equalTo: stackView.bottomAnchor, constant: 5).isActive = true
        mainStackView.leftAnchor.constraint(equalTo: view.leftAnchor, constant: 5).isActive = true
        mainStackView.rightAnchor.constraint(equalTo: view.rightAnchor, constant: -5).isActive = true
        mainStackView.bottomAnchor.constraint(equalTo: baseView.topAnchor, constant: -5).isActive = true
 
        builStartingArray()

    }
 
    func builStartingArray(){
        let viewStick:UIView = {
           let v = UIView()
            v.backgroundColor = .red
            v.translatesAutoresizingMaskIntoConstraints = false
            v.heightAnchor.constraint(equalToConstant: 150).isActive = true
            return v
        }()
        let viewStick2:UIView = {
           let v = UIView()
            v.backgroundColor = .red
            v.translatesAutoresizingMaskIntoConstraints = false
            v.heightAnchor.constraint(equalToConstant: 150).isActive = true
            return v
        }()
        mainStackView.addArrangedSubview(viewStick)
        mainStackView.addArrangedSubview(viewStick2)
    }
}

没有以编程方式添加到 UIStackView 的元素？

Elements not adding to UIStackView , programmatically?

swift

uikit

xcode11

uistackview

ios14