這篇文章簡單的描述UICollectionView的基本使用方法，供需要簡單瀑布流布局的同學查看。

• UICollectionView 使用時的一般思路

collectionView和tableView都有一個共同的路子：
1 注冊單元格、headerView和footerView；
2 有沒有header或者footer，其高度，內容的設置；
3 要顯示多少個section；
4 每個section多少個item；
5 每個item要顯示成什么樣子；
6 點擊事件的處理

需要注意的是：為了性能，collectionView和tableView都提供了單元格的重用機制，每當涉及到重用的時候，我們都要注意一下重影的問題。
按照這樣的思路，我們可以對這個空間進行基本的學習。

• 基本的方法調用

1. 聲明重用的ID 注冊單元格

定義重用單元格ID

//注冊事件
    [mainCollectionView  registerClass:[cutomCell class] forCellWithReuseIdentifier:kCellID];
    [mainCollectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:kReusableHeaderView];
    [mainCollectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:kReusableFooterView];

注冊單元格和表頭的方法 ，分為純代碼的和nib兩種形式
這里需要注意一點的是：注冊的kCellID、kReusableHeaderView和kReusableFooterView,分別對應的重用方法中要對應起來，否則是找不到要重用的單元部分，會報錯。

2. 設置headerView 和 footerView的大小，以及顯示的內容

//footer的size 
-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout referenceSizeForFooterInSection:(NSInteger)section
{
    return CGSizeMake(self.view.frame.size.width, 100);
}

//header的size
-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section
{
    return CGSizeMake(self.view.frame.size.width, 50);
}
- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath
{
    UICollectionReusableView *view;
    NSString *contentStr;
    if ([kind isEqualToString:UICollectionElementKindSectionFooter]) {
        view  = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:kReusableFooterView forIndexPath:indexPath];
        view.backgroundColor =[UIColor greenColor];
        contentStr = [NSString stringWithFormat:@"第 %ld 個FooterView",indexPath.section];
      
    }else{
       view = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:kReusableHeaderView forIndexPath:indexPath];
        view.backgroundColor =[UIColor grayColor];
        contentStr = [NSString stringWithFormat:@"第 %ld 個headerView",indexPath.section];

    }
    //防重影
    for (UIView *obj in view.subviews) {
        [obj removeFromSuperview];
    }
    
      UILabel *label = [[UILabel alloc] initWithFrame:view.bounds];
    label.text = contentStr;
    label.font = [UIFont systemFontOfSize:20];
    [view addSubview:label];
    return view;
}

3. 要顯示多少個section；

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

這個方法是可選的，默認情況下返回一個section。

4. 每個section多少個item；

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

5. 每個item要顯示成什么樣子；

//設置cell的大小
-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
    return CGSizeMake(100, 200);
}
//設置每個item的UIEdgeInsets
- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section
{
    //(CGFloat top, CGFloat left, CGFloat bottom, CGFloat right)
    return UIEdgeInsetsMake(10, 10, 10, 10);
}

//設置每個item水平間距
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section
{
    return 10;
}


//設置每個item垂直間距
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section
{
    return 15;
}

-(UICollectionViewCell*)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
    cutomCell *cell = (cutomCell*)[collectionView dequeueReusableCellWithReuseIdentifier:kCellID forIndexPath:indexPath];
   //防重影
    for (UIView *view in cell.subviews) {
        [view removeFromSuperview];
    }
    UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(20, 20, 50, 30)];
    label.text = [NSString stringWithFormat:@"%ld 行,%ld 列",indexPath.section,indexPath.row];
    label.adjustsFontSizeToFitWidth = YES;
    [cell.contentView addSubview:label];
    
    return cell;
}

6. 點擊事件的處理

- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
    NSLog(@"%ld,  %ld",indexPath.section,indexPath.row);
}

• 源代碼地址

[下載地址]https://git.oschina.net/zhuzhuxingzhi/collectionViewDemo.git