用 2 列大小相等的方形单元格显示 UICollectionView [英] Display UICollectionView with 2 columns of equal size square cells

问题描述

我正在努力实现以下目标:

我遵循了

这是集合视图控制器的代码:

class MainMenuViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayout {@IBOutlet var collectionView:UICollectionView！@IBOutlet 弱 var dateTimeLabel: MarqueeLabel！@IBOutlet 弱变量 iconButton:UIButton！@IBOutlet var imageView:UIImageView！var iconButtonTimer:计时器！var upDateTimer:计时器！var statusString: 字符串！var alertTitle:字符串！var networkStatusString: 字符串！覆盖 func viewDidLoad() {super.viewDidLoad()collectionView.dataSource = selfcollectionView.delegate = selfcollectionView.register(UINib.init(nibName: "MainMenuCell", bundle: nil), forCellWithReuseIdentifier: "MainMenuCell")collectionView.collectionViewLayout = MainMenuLayout()}func numberOfSections(in collectionView: UICollectionView) ->整数{返回 8}func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection 部分: Int) ->整数{返回 2}func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) ->CG尺寸{打印(#函数)让填充:CGFloat = 50让 collectionViewSize = collectionView.frame.size.width - 填充返回 CGSize(宽度:collectionViewSize/2，高度:collectionViewSize/2)}func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) ->UICollectionViewCell {let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "MainMenuCell", for: indexPath)cell.backgroundColor = UIColor.red返回单元格}}

这是故事板...

解决方案

符合UICollectionViewDelegateFlowLayout并实现

func collectionView(_ collectionView: UICollectionView,布局 collectionViewLayout: UICollectionViewLayout,insetForSectionAt 部分:Int) ->UIEdgeInsets {返回 UIEdgeInsetsMake(10, 10, 10, 10)}

也注释掉这一行

collectionView.collectionViewLayout = MainMenuLayout()

因为不需要自定义布局来完成你想要的

I'm trying to accomplish the following:

I've followed the answer in this question, but I get the image below:

This is the code for the collection view controller:

class MainMenuViewController: UIViewController, UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayout {



    @IBOutlet var collectionView: UICollectionView!
    @IBOutlet weak var dateTimeLabel: MarqueeLabel!
    @IBOutlet weak var iconButton: UIButton!
    @IBOutlet var imageView: UIImageView!

    var iconButtonTimer: Timer!
    var upDateTimer: Timer!

    var statusString: String!
    var alertTitle: String!
    var networkStatusString: String!




    override func viewDidLoad() {
        super.viewDidLoad()

        collectionView.dataSource = self
        collectionView.delegate = self

        collectionView.register(UINib.init(nibName: "MainMenuCell", bundle: nil), forCellWithReuseIdentifier: "MainMenuCell")

        collectionView.collectionViewLayout = MainMenuLayout()
    }


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

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

    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        print(#function)
        let padding: CGFloat =  50
        let collectionViewSize = collectionView.frame.size.width - padding

        return CGSize(width: collectionViewSize/2, height: collectionViewSize/2)
    }




    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {

        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "MainMenuCell", for: indexPath)

         cell.backgroundColor = UIColor.red

        return cell
    }
}

And this is the storyboard...

解决方案

Conform to UICollectionViewDelegateFlowLayout and implement

func collectionView(_ collectionView: UICollectionView,
                    layout collectionViewLayout: UICollectionViewLayout,
                    insetForSectionAt section: Int) -> UIEdgeInsets {

    return UIEdgeInsetsMake(10, 10, 10, 10)
}

Also comment this line

collectionView.collectionViewLayout = MainMenuLayout()

as no need for a custom layout to accomplish what you want

这篇关于用 2 列大小相等的方形单元格显示 UICollectionView的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！