UICollectionView

UICollectionView是Apple在iOS6开始，提供给咱们的一个强大的控件。最简单的UICollectionView就是GridView，标准的UICollectionView包含以下几个部分：

1 UICollectionReusableView<SupplementaryView>:能够指定section的Header或者Footer
2 UICollectionViewCell:用于展现内容的主体，对于不一样的cell能够指定不一样尺寸和不一样的内容

再次说明，UICollectionView的用法毫不止简单的几种！

实现一个简单的UICollectionView

UICollectionView的实现和UITableView相似，都是数据源(datasource)和代理(delegate)设计模式。datasource:提供数据源，告诉UICollectionView须要显示什么东西；delegate:代理，用于实现和用户交互。

 1 /// 必须实现的数据源方法
 2 /** 
 3  返会cell的数量
 4  */
 5 - (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section;
 6 
 7 /**
 8  返会cell视图
 9  */
10 - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath;
11 
12 
13 /// 可选实现的数据源方法
14 /**
15  返会section的数量
16  */
17 - (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView;
18 
19 /** 
20  返回头部或尾部
21  */
22 - (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath;
23 
24 /** 
25  iOS9系提供的方法,和cell的移动有关
26  */
27 - (BOOL)collectionView:(UICollectionView *)collectionView canMoveItemAtIndexPath:(NSIndexPath *)indexPath;
28 - (void)collectionView:(UICollectionView *)collectionView moveItemAtIndexPath:(NSIndexPath *)sourceIndexPath toIndexPath:(NSIndexPath*)destinationIndexPath;

为了更高效的使用cell，实现重用是必须的，值得注意的是,UICollectionViewCell使用以前必须先注册cell

 1 /**
 2  注册cell
 3  */
 4 - (void)registerClass:(nullable Class)cellClass forCellWithReuseIdentifier:(NSString *)identifier;
 5 - (void)registerNib:(nullable UINib *)nib forCellWithReuseIdentifier:(NSString *)identifier;
 6 
 7 /** 
 8  注册头部尾部
 9  */
10 - (void)registerClass:(nullable Class)viewClass forSupplementaryViewOfKind:(NSString *)elementKind withReuseIdentifier:(NSString *)identifier;
11 - (void)registerNib:(nullable UINib *)nib forSupplementaryViewOfKind:(NSString *)kind withReuseIdentifier:(NSString *)identifier;

对比于UITableViewCell的重用，苹果对UICollectionViewCell的重用作了优化，并未提供以下代码实现的方法：

1 - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
2     static NSString *reuseIdetifier = @"UITableViewCell";
3     UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:reuseIdentifier];
4     if (!cell) {
5         cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:reuseIdentifier];
6     }
7     return cell;
8 }

分析:UICollectionViewCell起初注册了cell，咱们只须要在数据源方法里面书写以下代码便可，不须要每次都判断cell是否存在。要是在重用队列里没有可用的cell的话，runtime将自动帮咱们生成并初始化一个可用的cell。

/**
  注册cell    
*/
[collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:reuseIdentifier];

/**
  实现数据源方法
*/
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:reuseIdentifier forIndexPath:indexPath];
    return cell;
}

 

UICollectionViewLayout，布局，之因此能实现各类效果，全依赖于这个类！UICollectionViewFlowLayout是苹果给咱们实现好的一个相似流水布局的布局类。下面，来讲明一下UICollectionViewFlowLayout的属性：

/** 
 每一行cell的最小间距
 */
@property (nonatomic) CGFloat minimumLineSpacing;

/**
 cell之间的最小间距
 */
@property (nonatomic) CGFloat minimumInteritemSpacing;

/**
 cell的尺寸(若是cell尺寸是固定的，直接指定该属性便可，不须要另外实现代理方法再去计算尺寸)
 */
@property (nonatomic) CGSize itemSize;

/**
 估算的cell尺寸
 */
@property (nonatomic) CGSize estimatedItemSize NS_AVAILABLE_IOS(8_0);

/**
 指定UICollectionView滚动方法
 */
@property (nonatomic) UICollectionViewScrollDirection scrollDirection;

/**
 头部尺寸
 */
@property (nonatomic) CGSize headerReferenceSize;

/**
 尾部尺寸
 */
@property (nonatomic) CGSize footerReferenceSize;

/**
 指定 UICollectionView 总体视图的上、左、下、右的缩进(间距)
 */
@property (nonatomic) UIEdgeInsets sectionInset;

/**
 iOS9新提供的,能够实现头部和尾部的悬浮效果
 */
@property (nonatomic) BOOL sectionHeadersPinToVisibleBounds NS_AVAILABLE_IOS(9_0);
@property (nonatomic) BOOL sectionFootersPinToVisibleBounds NS_AVAILABLE_IOS(9_0);

 

tip:当UICollectionView内容不足以占满整屏时会出现不能滑动的现场，如下为实现可滑动的方法:

    /// 建议只把和布局滚动方向一致的bounce设置为YES
    // 状况一
    flowLayout.scrollDirection = UICollectionViewScrollDirectionVertical;
    collectionView.alwaysBounceVertical = YES;
    
    // 状况二
    flowLayout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
    collectionView.alwaysBounceHorizontal = YES;

 

尊重做者劳动成果，转载请注明： 【kingdev】