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);
}
}