释放双眼,带上耳机,听听看~!
首先创建一个collectionView,
创建的时候UICollectionViewFlowLayout必须创建
layout.itemSize必须设置
必须注册一个collectionView的自定义cell
/**
创建layout(布局)
UICollectionViewFlowLayout 继承与UICollectionLayout
对比其父类 好处是 可以设置每个item的边距 大小 头部和尾部的大小
*/
UICollectionViewFlowLayout * layout = [[UICollectionViewFlowLayout alloc]init];
CGFloat itemWidth = (SCREEN_WIDTH - 30) / 3;
// 设置每个item的大小
layout.itemSize = CGSizeMake(itemWidth, itemWidth + 20 + 30);
// 设置列间距
layout.minimumInteritemSpacing = 1;
// 设置行间距
layout.minimumLineSpacing = 1;
//每个分区的四边间距UIEdgeInsetsMake
layout.sectionInset = UIEdgeInsetsMake(10, 10, 10, 10);
//
// 设置Item的估计大小,用于动态设置item的大小,结合自动布局(self-sizing-cell)
//layout.estimatedItemSize = CGSizeMake(<#CGFloat width#>, <#CGFloat height#>);
// 设置布局方向(滚动方向)
// layout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
// 设置头视图尺寸大小
//layout.headerReferenceSize = CGSizeMake(<#CGFloat width#>, <#CGFloat height#>);
// 设置尾视图尺寸大小
//layout.footerReferenceSize = CGSizeMake(<#CGFloat width#>, <#CGFloat height#>);
//
// 设置分区(组)的EdgeInset(四边距)
//layout.sectionInset = UIEdgeInsetsMake(<#CGFloat top#>, <#CGFloat left#>, <#CGFloat bottom#>, <#CGFloat right#>);
//
// 设置分区的头视图和尾视图是否始终固定在屏幕上边和下边
// layout.sectionFootersPinToVisibleBounds = YES;
// layout.sectionHeadersPinToVisibleBounds = YES;
/**
初始化mainCollectionView
设置collectionView的位置
*/
CGFloat height = self.contentView.frame.size.height;
_collectionView = [[UICollectionView alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, height) collectionViewLayout:layout];
/** mainCollectionView 的布局(必须实现的) */
_collectionView.collectionViewLayout = layout;
//mainCollectionView 的背景色
_collectionView.backgroundColor = [UIColor clearColor];
//禁止滚动
//_collectionView.scrollEnabled = NO;
//设置代理协议
//_collectionView.delegate = self;
//设置数据源协议
//_collectionView.dataSource = self;
/**
四./注册cell
在重用池中没有新的cell就注册一个新的cell
相当于懒加载新的cell
定义重用标识符(在页面最上定义全局)
用自定义的cell类,防止内容重叠
注册时填写的重用标识符 是给整个类添加的 所以类里有的所有属性都有重用标识符
*/
//[_collectionView registerClass:<#(nullable Class)#> forCellWithReuseIdentifier:<#(nonnull NSString *)#>];
//注册头部(初始化头部)
//[_collectionView registerClass:<#(nullable Class)#> forSupplementaryViewOfKind:<#(nonnull NSString *)#> withReuseIdentifier:<#(nonnull NSString *)#>];
//注册尾部
//[_collectionView registerClass:<#(nullable Class)#> forSupplementaryViewOfKind:<#(nonnull NSString *)#> withReuseIdentifier:<#(nonnull NSString *)#>];
[self.contentView addSubview:self.collectionView];
//懒加载标签和图片视图
- (UILabel *)titleLabel{
if (_titleLabel == nil) {
_titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, self.imageView.pd_height, self.contentView.pd_width, 20)];
_titleLabel.numberOfLines = 0;
// _titleLabel.backgroundColor = [UIColor greenColor];
}
return _titleLabel;
}
- (UIImageView *)imageView{
if (_imageView == nil) {
CGFloat imageViewWH = self.contentView.frame.size.width;
_imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, imageViewWH, imageViewWH)];
}
return _imageView;
}
//重写初始化方法
- (instancetype)initWithFrame:(CGRect)frame{
self = [super initWithFrame:frame];
if (self) {
//加载自定义的两个控件
[self.contentView addSubview:self.imageView];
[self.contentView addSubview:self.titleLabel];
}
return self;
}
在- (__kindof UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:
方法中创建自定义的cell
PDSectionEightCell * cell = (PDSectionEightCell *)[tableView dequeueReusableCellWithIdentifier:identifierForSectionEight];
if (cell == nil) {
cell = [[PDSectionEightCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:identifierForSectionEight];
}
[cell.collectionView registerClass:[PDSectionEightCollectionViewCell class] forCellWithReuseIdentifier:sectionEightCollectionViewCell];
cell.collectionView.delegate = self;
cell.collectionView.dataSource = self;
cell.collectionView.tag = TagForCollectionView + 8;
return cell;
数据源协议的两外两个方法
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
return 1;
}
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
return 6;
}
/**
分会每一个分区的头部视图
*/
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{
switch (section) {
case 3:{
PDSectionFourHeaderAndFooterView * headerView = [[PDSectionFourHeaderAndFooterView alloc] init];
return [headerView creationHeaderViewWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, 80)];
}break;
default:{
return nil;
}break;
}
}
返回分区的尾部视图
- (UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section{
switch (section) {
case 3:{
PDSectionFourHeaderAndFooterView * footerView = [[PDSectionFourHeaderAndFooterView alloc] init];
return [footerView creationFooterViewWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, 40)];
}break;
default:{
return nil;
}break;
}
}
/**
返回指定的cell的高度
*/
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
switch (indexPath.section) {
case 0:{
return 110;
}break;
default:{
return 90;
}break;
}
}
/**
返回指定分区的头部视图的高度
*/
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section{
switch (section) {
case 3:{//第4个分区
return 80;
}break;
default:{
return 4;
}break;
}
}
/**
返回指定分区的尾部视图的高度
分区的尾部视图必须存在才有这个回调方法,在加载tableView的时候必须设置尾部视图
*/
- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section{
switch (section) {
case 3:{
return 40;
}break;
default:{
return 0;
}break;
}
}
数据源方法,返回每个分区内多少个cell
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
switch (collectionView.tag) {
case (TagForCollectionView + 1):{
return [mv_dataSource[1] count];
}break;
default:{
return 1;
}break;
}
}
//已经选中某个item时触发的方法
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
switch (collectionView.tag) {
case (TagForCollectionView + 1):{
NSLog(@"已经选中第一个分区,第%ld个item", indexPath.row);
}break;
default:{
}break;
}
}
collectionView必须遵守的协议
//网格代理
<UICollectionViewDelegate,
UICollectionViewDataSource,
UICollectionViewDelegateFlowLayout>