本文是通过一个实例来了解如何使用UICollectionView，并在文章的最后加上了常用的方法

UICollectionView 和 UICollectionViewController 用于展示集合视图，布局更加灵活，可实现多列布局，用法类似于UITableView 和 UITableViewController 类。
使用UICollectionView 必须实现UICollectionViewDataSource,UICollectionViewDelegate,UICollectionViewDelegateFlowLayout这三个协议。

下面将通过一个例子，来具体介绍

• 自定义Cell

  1. 新建类CollectionViewCell继承自UICollectionViewCell 并勾上Also create XIB file
     
     image
     
     新建后出现三个文件CollectionViewCell.h、CollectionViewCell.m、CollectionViewCell.xib
  2. 点击CollectionViewCell.xib，改变cell大小为200*60
     
     image
  3. 在CollectionViewCell.xib的CollectionCell中添加一个ImageView和一个Label
     
     image

  4. 创建imageView与Label的映射

     
     
     image
     
     
     image
  5. 选中CollectionViewCell.m , 重写init方法

  self = [super initWithFrame:frame];
  if (self) {
      // 初始化时加载collectionCell.xib文件
      NSArray *arrayOfViews = [[NSBundle mainBundle] loadNibNamed:@"CollectionViewCell" owner:self options:nil];
      // 如果路径不存在，return nil
      if (arrayOfViews.count < 1){
          return nil;
      }
      // 如果xib中view不属于UICollectionViewCell类，return nil
      if (![[arrayOfViews objectAtIndex:0] isKindOfClass:[UICollectionViewCell class]]){
          return nil;
      }
      // 加载nib
      self = [arrayOfViews objectAtIndex:0];
  }
  return self;
  } ```
  6. 选中CollectionViewCell.xib 修改其identifier为CollectionCell
  
  

• 定义UICollectionView

  1. 拖动一个Collection View到指定ViewController的View上
  2. 连线dataSource和delegate，并创建映射，命名为CollectionView
     连线dataSource和delegate：选择collectionView按住CTRL键，拉至ViewController处
  3. 选中Collection View Cell 拉动大小至 200*60
  4. 选中CollectionViewCell，修改Class，继承自CollectionCell
  5. 在ViewDidLoad方法中声明Cell的类，在ViewDidLoad方法中添加，此句不声明，将无法加载，程序崩溃
     其中CollectionCell为cell的Identifier

[self.collectionView registerClass:[CollectionViewCell class] forCellWithReuseIdentifier:@"CollectionCell"];6. 选择十张照片拉入Assets.xcassets 这里我拉入的格式为.jpg 名称1~10 7. 在xxxViewController.h中声明代理
@interface ViewController : UIViewController<UICollectionViewDataSource,UICollectionViewDelegate>```
8. 在.m文件中实现代理方法

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
  //返回每个section中item的个数
  return 10;
}
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
  CollectionViewCell *cell = (CollectionViewCell *)[collectionView dequeueReusableCellWithReuseIdentifier:@"CollectionCell" forIndexPath:indexPath]; 
  //图片名称
  NSString *imageToLoad = [NSString stringWithFormat:@"%d.jpg", indexPath.row];
  //加载图片
  cell.imageView.image = [UIImage imageNamed:imageToLoad];
  //设置label文字
  cell.label.text = [NSString stringWithFormat:@"{%ld,%ld}",(long)indexPath.row,(long)indexPath.section];
  
  return cell;
}

• 效果图如下

  image

• 代码示例我已放在我的github上，欢迎下载

• 一些常见代码

pragma mark -- UICollectionViewDataSource

//定义展示的UICollectionViewCell的个数
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
return 30;
}
//定义展示的Section的个数
-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView
{
return 1;
}
//每个UICollectionView展示的内容
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
static NSString * CellIdentifier = @"GradientCell";
UICollectionViewCell * cell = [collectionView dequeueReusableCellWithReuseIdentifier:CellIdentifier forIndexPath:indexPath];

cell.backgroundColor = [UIColor colorWithRed:((10 * indexPath.row) / 255.0) green:((20 * indexPath.row)/255.0) blue:((30 * indexPath.row)/255.0) alpha:1.0f];  
return cell;  

}```

#pragma mark --UICollectionViewDelegateFlowLayout   
//定义每个UICollectionView 的大小  
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath  
{  
    return CGSizeMake(96, 100);  
}   
//定义每个UICollectionView 的 margin  
-(UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section  
{  
    return UIEdgeInsetsMake(5, 5, 5, 5);  
}
#pragma mark --UICollectionViewDelegate   
//UICollectionView被选中时调用的方法  
-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath  
{  
    UICollectionViewCell * cell = (UICollectionViewCell *)[collectionView cellForItemAtIndexPath:indexPath];  
    cell.backgroundColor = [UIColor whiteColor];  
}```