一个水平方向多行cell的自定义layout —LBHorizontalCollectionViewLayout ,仿淘宝金刚位布局

首先看效果图
请添加图片描述

LBHorizontalCollectionViewLayout

支持的效果

设置行数

水平多行滚动,默认两行,行数可配置,

计算总内容高度

可以根据cell的数量,限制行数,计算出总内容的高度

关键逻辑

重写layout 的布局方法
prepareLayout
最主要的是需要计算出列数
/*
根据不需滚动的时候最大行数 和 最大列数 计算出
不滚动的情况下展示的最多item的数量,和需要展示的item 的数量对比,
如果小于需要展示的item的数量,则需要滚动,滚动的时候每行的列数
的计算方法为 (itemCount + (maxRowNum - 1))/maxRowNum
(其中itemCount为需要展示的item总数)
**/
NSInteger colomnNum = 0;
if (maxRowNum * maxColomnNumWithScroll >= itemCount) {
///不需要滚动就能完全展示
colomnNum = maxColomnNumWithScroll;
} else {
///需要滚动才能完全展示,需要计算colomn数量
colomnNum = (itemCount + (maxRowNum - 1))/maxRowNum;
}

这里用到了一个重要的原理:
就是一个方形的阵列,
如图:现在是行数确定了,求列数
即已知n 和总数z,求m,
m = (z + (n - 1))/n
请添加图片描述

使用方法

pod ‘LBHorizontalCollectionViewLayout’


#使用方法
- (UICollectionView *)collectionView
{
    if (!_collectionView) {
        LBHorizontalCollectionViewLayout *layout = [[LBHorizontalCollectionViewLayout alloc] init];
        _collectionView = [[UICollectionView alloc] initWithFrame:CGRectZero collectionViewLayout:layout];
        _collectionView.contentInset = UIEdgeInsetsMake(0, 0, 0, 0);
        ///设置layout 的代理
        layout.delegate = self;
        layout.sectionInset = UIEdgeInsetsMake(0, 0, 10, 0);
        _collectionView.delegate = self;
        _collectionView.dataSource = self;
        [_collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:NSStringFromClass([UICollectionViewCell class])];
        _collectionView.showsHorizontalScrollIndicator = NO;
        if (@available(iOS 10.0, *)) {
            _collectionView.prefetchingEnabled = NO;
        } else {
            // Fallback on earlier versions
        }
        _collectionView.backgroundColor = [UIColor cyanColor];
    }
    return _collectionView;
}

#实现协议方法

#pragma mark - VVGeneralCategoryTopCellLayoutDeledate
- (CGSize)itemSizeForItemInCollectionView:(UICollectionView *)collectionView layout:(LBHorizontalCollectionViewLayout *)collectionViewLayout
{
    return CGSizeMake(CGRectGetWidth(self.view.bounds)/4.5, 97);
}

- (UIEdgeInsets)edgeInsetsForSectionInCollectionView:(UICollectionView *)collectionView layout:(LBHorizontalCollectionViewLayout *)collectionViewLayout
{
    return UIEdgeInsetsMake(10, 0, 0, 0);
}

#计算collectionView的高度 (如果需要计算的话)

LBMutilRowsHorizontalLayoutParameterModel *paramsModel = [[LBMutilRowsHorizontalLayoutParameterModel alloc] init];
paramsModel.itemCount = 50;
paramsModel.itemSize = CGSizeMake(CGRectGetWidth(self.view.bounds)/4.5, 97);
paramsModel.edgeInsetsForSection = UIEdgeInsetsMake(10, 0, 0, 0);
paramsModel.boundWidthSubtractContentInset = CGRectGetWidth(self.view.bounds);
CGFloat height = [LBHorizontalCollectionViewLayout heightOffContentWithLayoutParamsModel:paramsModel];
self.collectionView.frame = CGRectMake(0, 100, CGRectGetWidth(self.view.bounds), height);

demo

如果对您有帮助,欢迎star

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值