如何将集合视图单元格设置为所有屏幕的相等行单元格

Question

我正在使用swift 2.o集合视图。因为每件事都很好。但是当我在不同的屏幕上运行时，每个单元格之间的宽度差异是不同的。我需要在集合视图的每一行中有三个单元格，对于集合视图中的所有单元格，左侧，右侧，顶部，底部有8个px间隙。而且我还需要将单元格设置为角半径。我需要像下图： [！[在此处输入图像说明] [1]] [1]

但是当我在5s屏幕上运行时，我会像第二张图像那样得到6屏幕：

[！[在此处输入图像说明] [2]] [2]

iphone 6：

[！[在此处输入图像说明] [3]] [3]

看到左，右，底部，顶部之间的间隙与我的第一张图像不同。我需要得到像我的第一张图片。

我在故事板中为单元格设置了最小行空间为6。但我不能像我的第一个图像那样。

请帮帮我。

我的popvc.swift：

import UIKit

class popVC: UIViewController, UICollectionViewDataSource, UICollectionViewDelegate {

    var tableData: [String] = ["RESTAURANTS", "BANKS", "COFFEE","PIZZA", "HOTELS", "TAXI", "RESTAURANTS", "BANKS","COFFEE","PIZZA", "HOTELS", "TAXI","RESTAURANTS", "BANKS", "COFFEE","PIZZA", "HOTELS", "TAXI"]
    var tableImages: [String] = ["img1.png", "img2.png", "img3.png", "img4.png", "img5.png", "img6.png", "img7.png", "img8.png", "img9.png", "img10.png", "img11.png", "img11.png", "img1.png", "img2.png", "img3.png", "img4.png", "img5.png", "img6.png"]

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

    func collectionView(collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return tableData.count
    }

    func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
        let cell: colvwCell = collectionView.dequeueReusableCellWithReuseIdentifier("Cell", forIndexPath: indexPath) as! colvwCell
        cell.lblCell.text = tableData[indexPath.row]
        cell.imgCell.image = UIImage(named: tableImages[indexPath.row])
        return cell
    }

    func collectionView(collectionView: UICollectionView, didSelectItemAtIndexPath indexPath: NSIndexPath) {
        print("Cell \(indexPath.row) selected")
    }


    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }


}

Answer 1

从故事板中设置CollectionViews Section Inset from size inspector为Top = 8，Bottom = 8，Left = 8和Right = 8，它应该看起来像

将单元格的大小返回

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath {

   //If you want your cell should be square in size the return the equal height and width, and make sure you deduct the Section Inset from it.
   return CGSizeMake((self.view.frame.size.width/3) - 16, (self.view.frame.size.width/3) - 45);
}

多数民众赞成，仅此而已。你应该把结果看作我的：

Answer 2

使用以下代码创建集合视图：

@IBOutlet var collectionView: UICollectionView?
    var screenSize: CGRect!
    var screenWidth: CGFloat!
    var screenHeight: CGFloat!

 override func viewDidLoad() {


        print("select block is \(self.strBlockname)")

        screenSize = UIScreen.mainScreen().bounds
        screenWidth = screenSize.width
        screenHeight = screenSize.height
        let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
        layout.sectionInset = UIEdgeInsets(top: 10, left: 0, bottom: 10, right: 0)
        layout.itemSize = CGSize(width: (screenWidth/3)-1, height: (screenWidth/3)-1)
        layout.minimumInteritemSpacing = 1
        layout.minimumLineSpacing = 1
        collectionView = UICollectionView(frame: CGRectMake(0, 0, screenWidth, screenHeight-65), collectionViewLayout: layout)
        collectionView!.dataSource = self
        collectionView!.delegate = self
        collectionView!.registerClass(CollectionViewCell.self, forCellWithReuseIdentifier: "CollectionViewCell")
        collectionView!.backgroundColor = UIColor.whiteColor()
        self.view.addSubview(collectionView!)

        super.viewDidLoad()

        // Do any additional setup after loading the view.
    }

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

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





    func collectionView(collectionView: UICollectionView, cellForItemAtIndexPath indexPath: NSIndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCellWithReuseIdentifier("CollectionViewCell", forIndexPath: indexPath) as! CollectionViewCell
        cell.backgroundColor = UIColor.blackColor()
        cell.textLabel?.text = "\(indexPath.section):\(indexPath.row)"
        cell.imageView?.image = UIImage(named: "circle")
        return cell
    }
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

iPhone5s，6s和6+的输出如下：

<强> iPhone5s

<强> iPhone6s

Answer 3

@ user5513630在集合视图中添加以下代码。

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
        let size = UIScreen.mainScreen().bounds.size

// 8 - space between 3 collection cells
// 4 - 4 times gap will appear between cell.
        return CGSize(width: (size.width - 4 * 8)/3, height: 40)

    }

Answer 4

阅读this教程。它将满足您的要求