具有固定行数和列数的集合视图

Question

我有一个集合视图，希望在多个设备上保持一致的行数和列数。在iPhone 6s Plus上，会显示6个项目，但在iPhone 5s上查看应用程序时，只显示4个项目。

在此处查看我的布局：

如何让集合视图在各种设备上显示相同的项目？

Answer 1

适用于Swift 3.0。

确保您使用autoLayout并实施UICollectionView sizeForItemAtIndexPath。

  func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {

        return CGSize(width: collectionView.bounds.size.width/3 - yourCellInterItemSpacing, height: collectionView.bounds.size.height/3 - yourCellInterItemSpacing)
  }

这将允许根据屏幕大小创建单元格（假设您使用的是autoLayout），您应该除以所需的列数/行数。将宽度除以所需的列数和高度除以行数。

要提供屏幕截图中显示的前导和尾随空格，只需在故事板中为UICollectionView添加适当的空格即可。 I.e等于yourCellInterItemSpacing

的前导和尾随空格

确保您的班级符合UICollectionViewDelegateFlowLayout协议！

Answer 2

您需要根据collectionView中的screenize计算项目大小。最小间距应该是固定的。

func collectionView(collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAtIndexPath indexPath: NSIndexPath) -> CGSize {
     if UIScreen.mainScreen().applicationFrame.width > 375 { //iPhone 6plus
         //Calculate cell size
     }
     else if UIScreen.mainScreen().applicationFrame.width <= 375 && UIScreen.mainScreen().applicationFrame.width > 320 { //iPhone 6
         //Calculate cell size
     }
     else {
         //Calculate cell size
     } 
     return CGSizeMake(width, height)
}

也符合UICollectionViewDelegateFlowLayout之类的

class XYZ : UICollectionViewController, UICollectionViewDelegateFlowLayout

Answer 3

让您的课程符合UICollectionViewDatasource和UICollectionViewDelegate，并添加这些功能以制作包含10行的5列：

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

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