如何将 UICollectionView 放在 stackView 中？

Posted 2023-02-27

【中文标题】如何将 UICollectionView 放在 stackView 中？

【英文标题】：How can I put UICollectionViews in stackView?

【发布时间】：2019-08-17 14:01:56

【问题描述】：

我想像这张图片一样将 3 个 collectionViews 放在 stackViews 中。但是，当我模拟它时，我看不到我设计的 collectionViews。

Here is my Design. 3 CollectionViews in StackView

过去，我曾尝试过此站点CollectionView Disappears within StackView (Swift) 的此解决方案。但是，它不起作用。

class SecondViewController: UIViewController, UICollectionViewDelegate, UICollectionViewDataSource 
    let tcells:Int = 3, pcells:Int = 4
    var p1name:String = " ", p2name:String = " "
    var binScore: Array<Int> = [0,0,0,0]
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int 
        if collectionView == timerReset 
            return tcells
        
        return pcells
    

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell 
        if collectionView == p1board 
            if let p1nc: p1Name = collectionView.dequeueReusableCell(withReuseIdentifier: "p1Name", for: indexPath) as? p1Name
                p1nc.p1n.text! = p1name
                return p1nc
            
            if let p1jc: p1Judge = collectionView.dequeueReusableCell(withReuseIdentifier: "p1Judge", for: indexPath) as? p1Judge 
                return p1jc
            
            if let p1sc: p1Score = collectionView.dequeueReusableCell(withReuseIdentifier: "p1Score", for: indexPath) as? p1Score 
                return p1sc
            
        
        else if collectionView == p2board 
            if let p2nc: p2Name = collectionView.dequeueReusableCell(withReuseIdentifier: "p2Name", for: indexPath) as? p2Name
                p2nc.p2n.text! = p2name
                return p2nc
            
            if let p2jc: p2Judge = collectionView.dequeueReusableCell(withReuseIdentifier: "p2Judge", for: indexPath) as? p2Judge 
                return p2jc
            
            if let p2sc: p2Score = collectionView.dequeueReusableCell(withReuseIdentifier: "p2Score", for: indexPath) as? p2Score 
                return p2sc
            
        
        else 
            if let mtm: matchTimer = collectionView.dequeueReusableCell(withReuseIdentifier: "matchTimer", for: indexPath) as? matchTimer
                return mtm
            
            if let gtm: groundTimer = collectionView.dequeueReusableCell(withReuseIdentifier: "groundTimer", for: indexPath) as? groundTimer 
                return gtm
            
            if let rbtn: resetBtn = collectionView.dequeueReusableCell(withReuseIdentifier: "resetBtn", for: indexPath) as? resetBtn 
                return rbtn
            
        
        return UICollectionViewCell()
    

    override func didReceiveMemoryWarning() 
        super.didReceiveMemoryWarning()
    

    @IBOutlet weak var timerView: UIStackView!
    @IBOutlet weak var p1board: UICollectionView! // left side
    @IBOutlet weak var timerReset: UICollectionView! // mid
    @IBOutlet weak var p2board: UICollectionView! // right side

    override func viewDidLoad() 
        super.viewDidLoad()

        timerView.addArrangedSubview(p1board)
        timerView.addArrangedSubview(timerReset)
        timerView.addArrangedSubview(p2board)

        NSLayoutConstraint.activate([
            timerView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
            timerView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
            timerView.topAnchor.constraint(equalTo: view.topAnchor),
            timerView.bottomAnchor.constraint(equalTo: view.bottomAnchor),
            p1board.widthAnchor.constraint(equalTo: view.widthAnchor, multiplier: 0.3)
        ])

    

    override var preferredStatusBarStyle: UIStatusBarStyle 
        return .lightContent
    

【参考方案1】：

如果您想以编程方式将约束添加到视图（在本例中为 timerView），您必须这样做：

timerView.translatesAutoresizingMaskIntoConstraints = false

集合视图也需要知道它们的宽度和高度。所以你有两个选择：

1) 为每个集合视图添加高度和宽度约束。

2) 如果您希望集合视图具有相同的宽度，请将堆栈的分布设置为平均填充。

timerView.distribution = .fillEqually

PD：看你的设计，我认为你应该使用三个 TableViews 而不是 CollectionViews。

【讨论】：

如果你不介意，我可以问推荐的书籍、讲座或指南来学习 ios 开发吗？

这是 iOS 11 的，反正我还是推荐它：itunes.apple.com/es/course/developing-ios-11-apps-with-swift/…