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