自从UICollectionView这个集合视图开始推出备受大家的喜爱,所以我最近就一直在学习它的相关知识,发现它确实是一个很好用的集合视图。现在把我在学习过程中总结的经验记录如下:
1、要想在UICollectionView中显示数据,首先要注册一个cell;
注册cell的方法:
// - (void)registerClass:forCellWithReuseIdentifier: // - (void)registerClass:forSupplementaryViewOfKind:withReuseIdentifier: // - (void)registerNib:forCellWithReuseIdentifier: // - (void)registerNib:forSupplementaryViewOfKind:withReuseIdentifier:
2、显示数据,它的用法类似于UITableView,它也提供了数据源的UICollectionViewDataSource以及处理用户交互的代理UICollectionViewDelegate;
跟tableView 一样,要想显示数据必须实现UICollectionViewDataSource的方法:
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView {// 返回section的个数(课理解为--组数) return 1; } - (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {// 返回每组的cell的个数 return 30; } - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {// 返回每个cell应显示的内容(这里,我只是设置了cell的背景颜色) UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath]; cell.backgroundColor = [UIColor greenColor]; return cell; }
到这里,UICollectionView的基本用法已经掌握了!但这样的效果显得有点太单调了。对于cell的样式和组织方式,由于collectionView比tableView要复杂得多,因此没有按照类似于tableView的style的方式来定义,而是专门使用了一个类来对collectionView的布局和行为进行描述,这就是UICollectionViewLayout。下面,我只是简单的给每组的cell添加一个头部headerView。
这里要注意,想要对cell进行布局,首先要注册一个UICollectionReusableView类型的实例,方法跟注册一个cell差不多:
[_collectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"header"];
实现代理UICollectionViewDelegateFlowLayout,并实现- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath这个方法,如:
- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath {// 这里我只是改变的头部的背景颜色 UICollectionReusableView *header = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"header" forIndexPath:indexPath]; header.backgroundColor = [UIColor purpleColor]; return header; }
到这里CollectionView的头部就添加完了,至于尾部,就可以仿照头部一样就行了。。。
下面是效果图: