UICollectionView 中的方形单元格布局

Question

我正在构建一个 ios 应用程序，我需要在横向模式下连续显示 8 个单元格。也必须有 5 行，总共显示 40 个单元格。无论是iPad还是iPhone都必须与设备无关，必须交付相同的外观。

Answer 1

确保实施 UICollectionViewDelegate and UICollectionViewDataSource

然后分配委托和数据源： myCollectionView.delegate = self; myCollectionView.dataSource = self;

然后使用 collectionView 的数据源和委托方法在视图控制器中传递信息：

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath

- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView { }

- (NSInteger)collectionView:(UICollectionView *)collectionView

您可能想要 5 个部分，每个部分 8 件，或者只有一大部分 40 件

如果您想指定集合视图单元格的大小，请实施 UICollectionViewDelegateFlowLayout 然后你可以使用委托方法：

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

指定大小。这样你就可以设置你的视图，这样你就可以同时显示所有 5 行 8

Answer 2

Jpark822 的答案是正确的，但是您会为单元格的间距和偏移而苦恼。

你可以做的是使用 UICollectionViewFlowLayout 子类：

我们称它为 PrettyLayout 吧！

@implementation PrettyFlowLayout

#define itemCountPerLine 8
#define itemCountPerColumn 5

-(void) prepareLayout
{
    CGFloat lineSpacing = ([self collectionViewContentSize].width - self.itemSize.width * itemCountPerLine) / (itemCountPerLine + 1);
    CGFloat interItemSpacing = ([self collectionViewContentSize].height - self.itemSize.height * itemCountPerColumn) / (itemCountPerColumn + 1);

    self.minimumLineSpacing = lineSpacing;
    self.minimumInteritemSpacing = interItemSpacing;

    self.sectionInset = UIEdgeInsetsMake(interItemSpacing, lineSpacing, interItemSpacing, lineSpacing);
}

- (CGSize)itemSize
{
    int size;

    size = (int) MIN(self.collectionView.frame.size.width / itemCountPerLine, self.collectionView.frame.size.height / itemCountPerColumn )

    return CGSizeMake((CGFloat)size, (CGFloat)size);
}

@end

然后您需要做的就是将 PrettyLayout 的实例声明为您的 collectionview 的布局。

PS : 没有尝试我的代码，希望它能工作

UICollectionView 中的方形单元格布局

Square cells layout in UICollectionView

objective-c

ios

uicollectionview

uicollectionviewcell

uicollectionviewlayout