UICollectionview的使用、头视图尾视图的自定义

UICollectionview的基本使用 一些小心得

UICollectionview 其实和UITableview很类似，一般之前看到购买类的瀑布流 第一时间都会想到用UICollectionview，但是现在这种瀑布流一般是由H5替换了，这里简单介绍一下UICollectionview的使用。主要是设置自定义头尾视图和init时候和tableview有一点差别

创建对象

UICollectionView的创建必须要先创建一个UICollectionViewFlowLayout 通过layout 设置collection的水平方向还是竖直方向 设置每个item的大小 如下代码所示 除了基本的delegate 和dateSource 一些代理方法在UICollectionViewDelegateFlowLayout中

_layout = [[UICollectionViewFlowLayout alloc]init]; _layout.scrollDirection = UICollectionViewScrollDirectionVertical; //UICollectionViewScrollDirectionHorizontal
_layout.itemSize = CGSizeMake(( KSCreenWidth - 30) / 2.0, 150);
_listCollectionView = [[UICollectionView alloc]initWithFrame:CGRectMake(0, 64, KSCreenWidth, KSCreenHeight - 49 - 64) collectionViewLayout:_layout];
_listCollectionView.delegate = self; //设置代理
_listCollectionView.dataSource = self；
[_listCollectionView registerClass:[HomeListCollectionViewCell class] forCellWithReuseIdentifier:@"cellId"]; //在要自定义cell时候就必须要先注册cell 这样实现复用

返回分区个数

-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
        return 3;
}

返回每个分区的item个数

-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{  
    return 0;
}

//返回每个item

-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
    HomeListCollectionViewCell * cell  = [collectionView dequeueReusableCellWithReuseIdentifier:@"cellId" forIndexPath:indexPath];
    cell.backgroundColor = [UIColor whiteColor];
    return cell;
}

//点击索引事件

- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
    NSLog(@"点击了%ld组第%ld个",(long)indexPath.section,(long)indexPath.row);
}

//设置了每个item的填充

-(UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section
{
    return UIEdgeInsetsMake(10, 10, 10,10);
}

这样基本实现了collection简单使用

UICollectionView的头视图 尾视图的自定义

使用自定义头视图 尾视图时候 一般建议先注册cell 这样复用cell
//自定义头视图

[_listCollectionView registerClass:[HomeCollectionReusableView class]forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"cellId2"];

//自定义尾视图

[_listCollectionView registerClass:[HomeCollectionReusableView class]forSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:@"cellId3"];

然后在代理方法中实现代理方法

- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath
{
    HomeCollectionReusableView *reusableView = nil;
//这里举例为头视图
    if (kind == UICollectionElementKindSectionHeader) {
        if (indexPath.section == 0) {
              HomeCollectionReusableView *headerView = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"cellId2" forIndexPath:indexPath];
            headerView.name = @"正在直播";
            headerView.index = (int)indexPath.section;
            reusableView = headerView;
        }else
        {
            HomeCollectionReusableView *headerView = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"cellId3" forIndexPath:indexPath];
            headerView.name = self.groupArray[indexPath.section - 1];
            headerView.index = (int)indexPath.section;
            reusableView = headerView;
        }
    }
    return reusableView;
}

//设置头视图 尾视图的高度

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section
{
    if (section == 0) {
            return CGSizeMake(KSCreenWidth, 30);
    }else
    {
        return CGSizeMake(KSCreenWidth, 30);
    }
}

现在在这基本上已经实现了UICollectionView的基本使用了 欢迎指点和建议