Question

我目前有一个UICollectionView，它有许多自定义UICollectionViewCell设置为子视图。

我已经在网格（6 x 2）中布置了其中一个自定义单元格。

旋转设备（横向）后，网格视图会扩展正确的框架宽度，但是6x2布局会丢失。

我已将Home ViewController设置为...

override func willTransition(to newCollection: UITraitCollection, with coordinator: UIViewControllerTransitionCoordinator) {
    collectionViewLayout.invalidateLayout()
}

自定义SubView有...

    import UIKit

    class ActivityCollectionViewCell: UICollectionViewCell, UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayout  {

        private let cellId = "cell"

    // Month names
    let months: [String] = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"]

    override init(frame: CGRect) {
        super.init(frame: frame)

        setupViews()

        }

    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

    let appsCollectionView: UICollectionView = {

        var gridLayout = Gridlayout(numberOfColumns: 6)
        let layout = UICollectionViewFlowLayout()

        let cv = UICollectionView(frame: .zero, collectionViewLayout: layout)
        cv.translatesAutoresizingMaskIntoConstraints = false
        cv.isScrollEnabled = false
        cv.collectionViewLayout = gridLayout
        return cv
    }()



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

    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: cellId, for: indexPath)

        let textLabel = UILabel(frame: .zero)

        textLabel.textColor = UIColor.myAppWhite
        textLabel.adjustsFontSizeToFitWidth = true
        textLabel.textAlignment = .center
        textLabel.layer.cornerRadius = 10
        textLabel.layer.borderWidth = 1
        textLabel.layer.borderColor = UIColor.myAppWhite.cgColor
        textLabel.layer.masksToBounds = true
        textLabel.translatesAutoresizingMaskIntoConstraints = false
        textLabel.text = months[indexPath.row]

        cell.contentView.addSubview(textLabel)

        cell.addConstraintsWithFormat(format: "H:|[v0]|", views: textLabel)
        cell.addConstraintsWithFormat(format: "V:|[v0]|", views: textLabel)

        return cell
    }

    func setupViews() {

        self.addSubview(appsCollectionView)

        appsCollectionView.delegate = self
        appsCollectionView.dataSource = self

        appsCollectionView.register(AppCell.self, forCellWithReuseIdentifier: cellId)

        addConstraintsWithFormat(format: "H:|[v0]|", views: appsCollectionView)
        addConstraintsWithFormat(format: "V:|[v0]|", views: appsCollectionView)
    }

    // Detetect if UICollectionViewCell was selected
    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
        let cell : UICollectionViewCell = collectionView.cellForItem(at: indexPath)!
        cell.layer.masksToBounds = true
        cell.layer.cornerRadius = 10
        cell.backgroundColor = UIColor.myAppRed
        print("Selected: \(indexPath.row)" )
    }

    // Detetect if UICollectionViewCell was deselected
    func collectionView(_ collectionView: UICollectionView, didDeselectItemAt indexPath: IndexPath) {
        let cell : UICollectionViewCell = collectionView.cellForItem(at: indexPath)!
        cell.layer.masksToBounds = true
        cell.layer.cornerRadius = 10
        cell.backgroundColor = .clear
        print("DeSelected: \(indexPath.row)" )
    }

}

    class AppCell: UICollectionViewCell {
        override init(frame: CGRect) {
            super.init(frame: frame)
        }
    required init?(coder aDecoder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }

}

我的自定义GridLayout类看起来像这样......

import UIKit

class Gridlayout: UICollectionViewFlowLayout {

    var numberOfColumns: Int = 6

init(numberOfColumns: Int) {
    super.init()
    self.numberOfColumns = numberOfColumns
    self.minimumLineSpacing = 5
    self.minimumInteritemSpacing = 0
}

required init?(coder aDecoder: NSCoder) {
    fatalError("init(coder:) has not been implemented")
}

override var itemSize: CGSize {

    get {
        if let collectionView = collectionView {

                let columns = 6
                let margings = 2 * (columns - 1)

                let width = (collectionView.frame.width - CGFloat(margings)) / CGFloat(columns)
                let height = width // square cells

                print ("Hello")


                return CGSize(width: width, height: height)
        }

        //Default
        return CGSize(width: 50, height: 50)
    }

    set {
        super.itemSize = newValue


       }
    }

}

我的UIView扩展（查看约束）

extension UIView {
func addConstraintsWithFormat(format: String, views: UIView...) {
    var viewsDictionary = [String: UIView]()
    for (index, view) in views.enumerated() {
        let key = "v\(index)"
        viewsDictionary[key] = view
    }
    addConstraints(NSLayoutConstraint.constraints(withVisualFormat: format, options: NSLayoutFormatOptions(), metrics: nil, views: viewsDictionary))
}

如何调整gridview的大小以使（6 x 2）布局保持不变（仅适用于屏幕）？

非常感谢任何反馈。

Answer 1

    override func viewWillLayoutSubviews() {
      super.viewWillLayoutSubviews()

      guard let flowLayout = collectionView.collectionViewLayout as? UICollectionViewFlowLayout else {
        return
      }

      if UIInterfaceOrientationIsLandscape(UIApplication.sharedApplication().statusBarOrientation) {
        //logic for the cell size if phone is in landscape
flowLayout.itemSize = CGSize(width: 100, height: 100);
      } else {
        //logic if not landscape 
flowLayout.itemSize = CGSize(width: 50, height: 50);
      }

      flowLayout.invalidateLayout()
    }

设备轮换上的Swift UIcollectionViewcell网格布局子视图无法正确更新（以编程方式）

1 个答案: