如何根据设备屏幕大小调整集合视图单元格的大小？

Question

我注意到单元格总是遵循尺寸检查器中的定义。即使我已经应用了UICollectionViewDelegateFlowLayout。

这就是它的外观。但我希望细胞看起来更像是在更小的iPhone屏幕上。

Answer 1

迅速

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {

    let height = view.frame.size.height
    let width = view.frame.size.width
    // in case you you want the cell to be 40% of your controllers view
    return CGSize(width: width * 0.4, height: height * 0.4)
}

目标C.

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

   CGFloat height = self.view.frame.size.height;
   CGFloat width  = self.view.frame.size.width;
   // in case you you want the cell to be 40% of your controllers view
   return CGSizeMake(width * 0.4, height * 0.4);
 }

Answer 2

斯威夫特4

你可以这样做：

class yourClassName: UIViewController, UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout {


    func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
            return CGSize(width: self.myCollectionView.frame.height / 6 * 5, height: self.myCollectionView.frame.height / 6 * 5)

        }


}

self.myCollectionView是您收藏视图项目的参考 实施UICollectionViewDelegateFlowLayout非常重要

而且因为它不适合另一个单元格，所以只有一行。

Answer 3

在设置单元格大小而不是数字时，您应该尝试使用简单的公式：

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        return CGSize(width: view.frame.width / 2, height: 350)
    }

将它除以2意味着单元格总是屏幕大小的一半，带走了你所调用的minimumLineSpacing函数和/或UIEdgeInset方法。希望这可以帮助。

Answer 4

在swift 3中，您可以使用collectionViewLayout属性根据屏幕调整集合视图单元格的大小。

即

   let numberOfCell = 3
   let cellSpecing = 10
   if let layout = collectionView.collectionViewLayout as? UICollectionViewFlowLayout {
        layout.itemSize = CGSize(width: (screenSize.width - (cellSpecing * (numberOfCell + 1))) / numberOfCell, height: cellHeight)
        layout.invalidateLayout()
    }

Answer 5

在Swift 4中 您可以从UICollectionViewDelegateFlowLayout扩展视图控制器并实现此方法：

func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
        let height = collectionView.frame.height
        let width  = collectionView.frame.width
        return CGSize(width: width, height: height)
    }

在这个例子中，我使单元格的宽度等于CollectionView的宽度，你可以根据你的需要调整它。

Answer 6

根据我的经验，您必须使用UICollectionView方法获取特定于设备的集合视图单元格大小，按照以下方法，您可以获得集合视图单元格的动态宽度和高度。

// Dynamic width & height
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
    float cellSize = collectionView.frame.size.width/values.count;
    return CGSizeMake(cellSize - 10, collectionView.frame.size.height);
}

//For top/bottom/left/right padding method
- (UIEdgeInsets)collectionView:(UICollectionView*)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section
{
    return UIEdgeInsetsMake(0, 0, 0, 1);
}



- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section {
    float width = collectionView.frame.size.width;
    float spacing = [self collectionView:collectionView layout:collectionViewLayout minimumInteritemSpacingForSectionAtIndex:section];
    int numberOfCells = (width + spacing) / (cellSize + spacing);
    int inset = (width + spacing - numberOfCells * (cellSize + spacing) ) / 2;

    return UIEdgeInsetsMake(0, inset, 0, inset);
}
- (CGFloat)collectionView:(UICollectionView *) collectionView layout:(UICollectionViewLayout *)collectionViewLayout
minimumInteritemSpacingForSectionAtIndex:(NSInteger) section
{
    return 1.0;
}

希望这可以帮助您根据设备大小设计您的单元格。

Answer 7

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

    let theWidth = (_screenSize.width - (15*3))/2    // it will generate 2 column 
    let theHeight = (_screenSize.height - (10*2))/3   // it will generate 3 Row 
    return CGSize(width: theWidth ,height: theHeight)
}