iOS开发：设置UICollectionView不同大小的item的方法
- 2019 年 12 月 19 日
- 筆記
在iOS开发过程中，UICollectionView的使用作为iOS开发者来说都不陌生，但是要想完美的玩转UICollectionView的所有使用的技巧，还是需要了解很多的。本篇博文来分享一下关于UICollectionView设置不同大小item的方法，为的是迎合产品的需求，方便记录为了以后查看使用，分享给有需要的人。
设置不同大小的collectionview的item的方法也很简单，只是首先要确定item的布局元素都差不多，才能公用cell；然后需要继承UICollectionViewLayout重写布局方法，使得collectionview的不同宽度的item、每个item能够保持相同的间距不会等分。设置UICollectionView不同大小的item的核心就是调用方法：- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath，其他部分本篇博文不再过多介绍，一笔带过。具体实现步骤，如下所示。
一、懒加载初始化UICollectionView
下面代码的具体含义不再一一介绍，具体代码如下所示：
– (UICollectionView *)collectionView {
if (!_collectionView) {
UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init];
layout.minimumLineSpacing = 5;
layout.minimumInteritemSpacing = 5;
layout.itemSize = CGSizeMake((SCREEN_WIDTH – 20)/2.0, (SCREEN_WIDTH – 100)/2.0);
layout.sectionInset = UIEdgeInsetsMake(5, 5, 5, 5); //上左下右
_collectionView = [[UICollectionView alloc] initWithFrame:CGRectZero collectionViewLayout:layout];
if (@available(iOS 11.0, *)) {
_collectionView.contentInsetAdjustmentBehavior = UIScrollViewContentInsetAdjustmentNever;
}else {
self.automaticallyAdjustsScrollViewInsets = NO;
}
_collectionView.delegate = self;
_collectionView.dataSource = self;
_collectionView.backgroundColor = [UIColor whiteColor];
[_collectionView registerNib:[UINib nibWithNibName:NSStringFromClass([TeaHomeCollectionViewCell2 class]) bundle:nil] forCellWithReuseIdentifier:NSStringFromClass([TeaHomeCollectionViewCell2 class])];
[_collectionView registerNib:[UINib nibWithNibName:NSStringFromClass([TeaHomeCollectionReusableView class]) bundle:nil] forCellWithReuseIdentifier:NSStringFromClass([TeaHomeCollectionReusableView class])];
[_collectionView registerNib:[UINib nibWithNibName:NSStringFromClass([TeaHomeCollectionReusableView class]) bundle:nil] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"headerView"];
}
return _collectionView;
}
二、UICollectionView的代理方法
1、代理方法一，如下所示：
– (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
return _proArr.count; //数据源的数组
}
2、本篇的重点，继承UICollectionViewLayout重写布局方法，本篇实例的需求就是通过该方法实现不同大小的item的操作，具体如下所示：
– (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
if (indexPath.section == 0) {
if (indexPath.row == 0 || indexPath.row == 1) {
return CGSizeMake((SCREEN_WIDTH – 20)/2.0, (SCREEN_WIDTH – 100)/2.0);//返回两个小的cell的尺寸
}else if (indexPath.row == 2) {
return CGSizeMake((SCREEN_WIDTH – 10), (SCREEN_WIDTH – 100)/2.0);//返回大的cell的尺寸
}
}
return CGSizeZero;
}
3、代理方法二，如下所示：
– (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
TeaHomeCollectionViewCell2 *cell = [collectionView dequeueReusableCellWithReuseIdentifier:NSStringFromClass([TeaHomeCollectionViewCell2 class]) forIndexPath:indexPath];
cell.bgImgV.contentMode = UIViewContentModeScaleAspectFill; //防止图片变形
[cell.bgImgV sd_setImageWithURL:[NSURL URLWithString:_proArr[indexPath.row]] placeholderImage:[UIImage imageNamed:@""]];
return cell;
}
具体效果图如下所示：
