一,代码:
1.布局方式设置,创建UICollectionView
- (void)initailContentView {
//导航
self.navigationBar = ({
CGFloat X = 0.0f;
CGFloat Y = 0.0f;
CGFloat W = [UIScreen mainScreen].bounds.size.width;
CGFloat H = 44.f;
UIView *view = [[UIView alloc]initWithFrame:CGRectMake(X, Y, W, H)];
view;
});
[self.view addSubview:self.navigationBar];
//表视图
self.listView = ({
CGFloat X = 0.0f;
CGFloat Y = CGRectGetMaxY(self.navigationBar.frame);
CGFloat W = [UIScreen mainScreen].bounds.size.width;
CGFloat H = ([UIScreen mainScreen].bounds.size.height - Y);
//初始化layout
UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc]init];
//设置布局方式为竖直布局 系统默认竖直布局
layout.scrollDirection = UICollectionViewScrollDirectionVertical;
//设置同一列中间隔的cell最小间距
layout.minimumInteritemSpacing = 5.f;
//设置最小行间距
layout.minimumLineSpacing = 5.f;
//每个分区的上,左,下,右的缩进量
layout.sectionInset = UIEdgeInsetsMake(10.f, 10.f, 10.f, 10.f);
//设置每个item的大小
CGFloat itemW = (W - layout.minimumLineSpacing - layout.sectionInset.left - layout.sectionInset.right)/2.f;
CGFloat itemH = 80.f;
layout.itemSize = CGSizeMake(itemW, itemH);
//创建UICollectionView
UICollectionView *collectionView = [[UICollectionView alloc]initWithFrame:CGRectMake(X, Y, W, H) collectionViewLayout:layout];
collectionView.delegate = self;
collectionView.dataSource = self;
collectionView.showsVerticalScrollIndicator = NO;
collectionView.showsHorizontalScrollIndicator = NO;
collectionView.backgroundColor = [UIColor whiteColor];
collectionView;
});
[self.view addSubview:self.listView];
//注册cell
[self.listView registerClass:CustomCollectionViewCell.class forCellWithReuseIdentifier:NSStringFromClass(CustomCollectionViewCell.class)];
//注册header
[self.listView registerClass:CustomCollectionReusableView.class forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"CustomCollectionReusableViewHeader"];
}
2.遵循代理 并实现数据源代理方法
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView {
return self.dataSource.count;
}
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
return self.dataSource[section].items.count;
}
- (__kindof UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
CustomCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:NSStringFromClass(CustomCollectionViewCell.class) forIndexPath:indexPath];
cell.model = self.dataSource[indexPath.section].items[indexPath.item];
return cell;
}
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath {
}
///分区头
- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath {
if ([kind isEqualToString:UICollectionElementKindSectionHeader]) {
CustomCollectionReusableView *header = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"CustomCollectionReusableViewHeader" forIndexPath:indexPath];
header.title = self.dataSource[indexPath.section].name;
return header;
} else {
return [CustomCollectionReusableView new];
}
}
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout referenceSizeForFooterInSection:(NSInteger)section {
return CGSizeZero;
}
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section {
return CGSizeMake(CGRectGetWidth(collectionView.frame), 40.f);
}
3.自定义UICollectionViewCell
#pragma mark - Initail Methods
- (void)initailContentView {
self.titleLbl = ({
CGFloat X = 0.0f;
CGFloat W = CGRectGetWidth(self.frame);
CGFloat H = 20.f;
CGFloat Y = (CGRectGetHeight(self.frame) - H);
UILabel *lbl = [[UILabel alloc]initWithFrame:CGRectMake(X, Y, W, H)];
lbl.textColor = [UIColor blackColor];
lbl.font = [UIFont systemFontOfSize:15 weight:UIFontWeightRegular];
lbl;
});
[self addSubview:self.titleLbl];
self.headerView = ({
CGFloat X = 0.0f;
CGFloat Y = 0.0f;
CGFloat W = CGRectGetWidth(self.frame);
CGFloat H = CGRectGetMinY(self.titleLbl.frame);
UIView *view = [[UIView alloc]initWithFrame:CGRectMake(X, Y, W, H)];
view.backgroundColor = [UIColor blueColor];
view;
});
[self addSubview:self.headerView];
}
- (void)setModel:(CustomItemModel *)model {
_model = model;
self.titleLbl.text = model.name;
}
二,示例/demo
基础布局篇