以编程方式使用布局锚点的自动布局不起作用

Auto Layout using layout anchors programmatically not working

我正在尝试添加一个堆栈视图,其中包含顶部的 UILabel 和下方的 UICollectionView。我试图通过将其锚定到所有侧面来限制堆栈视图,使其占据完整视图。当我 运行 应用程序出现 UILabel 时,会出现一部分集合视图。集合视图说它的宽度和高度都是零。任何帮助将不胜感激,谢谢。

var collectionView: UICollectionView!
var titleLabel: UILabel!

override func viewDidLoad() {
    super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.
    self.view.translatesAutoresizingMaskIntoConstraints = false
    let margins = self.view.layoutMarginsGuide

    let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
    layout.sectionInset = UIEdgeInsets(top: 20, left: 10, bottom: 10, right: 10)

    collectionView = UICollectionView(frame: self.view.frame, collectionViewLayout: layout)
    layout.itemSize = CGSize(width: self.collectionView.frame.width / 4, height: self.collectionView.frame.width / 4)
    layout.minimumInteritemSpacing = self.collectionView.frame.width / 15
    layout.minimumLineSpacing = self.collectionView.frame.width / 5

    collectionView.backgroundColor = UIColor.black
    collectionView.dataSource = self
    collectionView.delegate = self
    collectionView.register(UICollectionViewCell.self, forCellWithReuseIdentifier: "Cell")

    titleLabel = UILabel()
    titleLabel.translatesAutoresizingMaskIntoConstraints = false

    titleLabel.textAlignment = .center
    titleLabel.numberOfLines = 1
    titleLabel.font = UIFont.systemFont(ofSize: 22)
    titleLabel.backgroundColor = UIColor.lightGray
    titleLabel.text = "Challenges"
    titleLabel.textColor = UIColor.red

    let stackView = UIStackView(arrangedSubviews: [titleLabel, collectionView])
    stackView.backgroundColor = UIColor.white
    stackView.axis = .vertical
    stackView.distribution = .fillEqually
    stackView.alignment = .fill
    stackView.spacing = 5
    self.view.addSubview(stackView)
    stackView.translatesAutoresizingMaskIntoConstraints = false

    //stackView.centerXAnchor.constraint(equalTo: self.view.centerXAnchor).isActive = true
    //stackView.centerYAnchor.constraint(equalTo: self.view.centerYAnchor).isActive = true
    stackView.topAnchor.constraint(equalTo: self.view.topAnchor).isActive = true
    stackView.leadingAnchor.constraint(equalTo: self.view.leadingAnchor).isActive = true
    stackView.trailingAnchor.constraint(equalTo: self.view.trailingAnchor).isActive = true
    stackView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor).isActive = true
    stackView.heightAnchor.constraint(equalTo: self.view.heightAnchor, multiplier: 1.0).isActive = true

}

更新:

我把我的代码 运行 放在一个新的单视图应用程序中,它按预期工作。正因为如此,我认为值得一提的是,我正在尝试将其合并到精灵工具包游戏中,并且我通过这样做来呈现视图控制器:

let root = self.view?.window?.rootViewController
var viewC = SelectionCollectionViewController()
root?.present(viewC, animated: false, completion: nil)

我是否需要采取特殊步骤,因为这是使用 sprite 工具包完成的?

我想你需要知道这些函数中发生了什么:

  • viewDidLoad
  • viewWillAppear
  • viewWillLayoutSubviews
  • viewDidLayoutSubviews
  • viewDidAppear

如果你使用了autoLayout,在viewDidLoad()的时候,frame是没有确认的,因为在viewWillLayoutSubviews()viewDidLayoutSubviews()的时候view会自动调整,所以建议你在viewDidAppear()中制作这些代码,然后你就会看到你想要的!

此外,如果您使用故事板或笔尖,则需要在 awakeFromNib()

中执行这些操作

我相信下面的屏幕截图是预期的输出。

你可能不需要 UIStackView ,你可以直接添加到 self.view.

添加到 self.view 后,您可以设置约束。您可以在 viewDidLayoutSubviews

中打印项目尺寸
class ViewController: UIViewController {

    var collectionView: UICollectionView!
    var titleLabel: UILabel!
    let collectionCellIdentifier:String = "collectionCellId"

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.

        let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
        layout.sectionInset = UIEdgeInsets(top: 20, left: 10, bottom: 10, right: 10)

        collectionView = UICollectionView(frame: CGRect.zero, collectionViewLayout: layout)
        collectionView.delegate = self
        collectionView.dataSource = self
        collectionView.register(UICollectionViewCell.classForCoder(), forCellWithReuseIdentifier: collectionCellIdentifier)

        collectionView.backgroundColor = UIColor.black
        collectionView.dataSource = self
        collectionView.delegate = self
        collectionView.register(UICollectionViewCell.self, forCellWithReuseIdentifier: "Cell")

        titleLabel = UILabel()


        titleLabel.textAlignment = .center
        titleLabel.numberOfLines = 1
        titleLabel.font = UIFont.systemFont(ofSize: 22)
        titleLabel.backgroundColor = UIColor.lightGray
        titleLabel.text = "Challenges"
        titleLabel.textColor = UIColor.red
        titleLabel.translatesAutoresizingMaskIntoConstraints =  false
        collectionView.translatesAutoresizingMaskIntoConstraints = false
        self.view.addSubview(titleLabel)
        self.view.addSubview(collectionView)

        setUpConstraints()
    }


    func setUpConstraints(){
        self.view.addConstraint(NSLayoutConstraint(item: self.titleLabel, attribute: .height, relatedBy: .equal, toItem: nil, attribute: .notAnAttribute, multiplier:0, constant:50.0 ))
        titleLabel.topAnchor.constraint(equalTo: self.view.topAnchor).isActive = true
        titleLabel.leadingAnchor.constraint(equalTo: self.view.leadingAnchor).isActive = true
        titleLabel.widthAnchor.constraint(equalTo: self.view.widthAnchor).isActive = true


        collectionView.topAnchor.constraint(equalTo: titleLabel.bottomAnchor).isActive = true
        collectionView.leadingAnchor.constraint(equalTo: self.view.leadingAnchor).isActive = true
        collectionView.trailingAnchor.constraint(equalTo: self.view.trailingAnchor).isActive = true
        collectionView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor).isActive = true
    }

    override func viewDidLayoutSubviews() {
        super.viewDidLayoutSubviews()
        let flowLayout = (collectionView.collectionViewLayout as! UICollectionViewFlowLayout)
        flowLayout.itemSize = CGSize(width: collectionView.frame.width / 4.0 , height: collectionView.frame.width / 4.0)
        flowLayout.minimumInteritemSpacing = self.collectionView.frame.width / 15.0
        flowLayout.minimumLineSpacing = self.collectionView.frame.width / 5.0
    }


}

extension ViewController:UICollectionViewDataSource,UICollectionViewDelegate {


    func numberOfSections(in collectionView: UICollectionView) -> Int {
        return 1
    }


    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return 10
    }

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: collectionCellIdentifier, for: indexPath)
        cell.backgroundColor = UIColor.gray
        return cell
    }

}