UICollectionView根据不同需求使用系统提供方法

经过对UICollectionView的进一步开发研究,灵活运用真的是其乐无穷啊,今天做了一个对比,一个简单的效果可以通过大量代码和“精简代码”两种代码量达到。

我们先看我想要实现的效果
这里写图片描述
我要在一个界面实现六个collectionview,每一个collectionview包括三列。然后每个collectionviewcell只有一个图片。(为了简单展示这里只用一个图片展示了)。

接下来就是collectionview自定义layout的时候了,这个也是我今天想要重点说的,首先说第一种方法,规规矩矩写的布局约束。代码如下:

#import "SingleCollectionLayout.h"

@interface SingleCollectionLayout()
/** 存放所有cell的布局属性 */
@property (nonatomic, strong) NSMutableArray *attrsArray;
/** 存放所有列的当前高度 */
@property (nonatomic,assign) CGFloat lastHeight;

@end
@implementation SingleCollectionLayout

#pragma mark -懒加载
-(NSMutableArray *)attrsArray
{
    if (!_attrsArray) {
        _attrsArray = [NSMutableArray array];
    }
    return _attrsArray;
}

#pragma mark -默认布局方法
/// 准备布局
- (void)prepareLayout {
    [super prepareLayout];

    //清除所有的布局属性
    [self.attrsArray removeAllObjects];
    //设置滚动方向
    self.scrollDirection = UICollectionViewScrollDirectionVertical;
    //设置竖直方向最小间距
    self.minimumLineSpacing = 1;
    //设置水平方向最小间距
    self.minimumInteritemSpacing = 1;

    NSInteger rowNum = [self.collectionView numberOfItemsInSection:0];
    for (NSInteger n = 0; n<rowNum; n++) {
        //创建对应的Indexpath
        NSIndexPath *indexPath = [NSIndexPath indexPathForRow:n inSection:0];
        // 获取indexPath位置cell对应的布局属性
        UICollectionViewLayoutAttributes *attrs = [self layoutAttributesForItemAtIndexPath:indexPath];
        [self.attrsArray addObject:attrs];
    }


}
-(NSArray<UICollectionViewLayoutAttributes *> *)layoutAttributesForElementsInRect:(CGRect)rect
{
    return self.attrsArray;
}
-(UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath
{
    // 创建布局属性
    UICollectionViewLayoutAttributes *attrs = [UICollectionViewLayoutAttributes layoutAttributesForCellWithIndexPath:indexPath];
    //声明cell的位置和大小
    CGFloat cellWidth,cellHeighth,cellX,cellY;
    //cell的宽高
    cellWidth = self.collectionView.frame.size.width / 3;
    cellHeighth = cellWidth;

    if (indexPath.row == 0) {
        //添加section的header部分到布局属性数组里面
        UICollectionViewLayoutAttributes *layoutAttributesHeader = [UICollectionViewLayoutAttributes layoutAttributesForSupplementaryViewOfKind:UICollectionElementKindSectionHeader withIndexPath:indexPath];
        layoutAttributesHeader.frame = CGRectMake(0, 0, self.collectionView.frame.size.width, 40);
        [self.attrsArray addObject:layoutAttributesHeader];
        cellX = 0;
        cellY = 40;
        _lastHeight = 40;
    }
    else
    {
        NSInteger currentColumn = indexPath.row % 3;
        if (!currentColumn) {
            _lastHeight += cellWidth;
        }
        cellX = currentColumn * cellWidth;
        cellY = _lastHeight;

    }
    attrs.frame = CGRectMake(cellX, cellY, cellWidth, cellHeighth);
    return attrs;
}

@end

根据上述代码我们可以看出来我的约束中只有一个header然后下面是每三个cell一行的布局,这样就是上述的规矩写法,下面我们看看简单的写法,简直刷新世界观。

#import "SingleCollectionLayout.h"

@implementation SingleCollectionLayout
/// 准备布局
- (void)prepareLayout {
    [super prepareLayout];


    self.headerReferenceSize = CGSizeMake(self.collectionView.frame.size.width, 40);
    //设置item尺寸
    CGFloat itemWH = (self.collectionView.frame.size.width - 6) / 3;
    self.itemSize = CGSizeMake(itemWH, itemWH);
    //设置滚动方向
    self.scrollDirection = UICollectionViewScrollDirectionVertical;

    //设置最小间距
    self.minimumLineSpacing = 1;
    self.minimumInteritemSpacing = 1;

}

没看错,就是这么一个方法,就是这么简单的几句话就可以完全实现上述的效果。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值