3257人阅读
遇到的问题（13）
今天没事自己写了个UICollectionView也就是九宫格的demo&，遇到几个小问题，虽然都很快解决了，但是这里还是把它记录下来，以后方便查阅。
（UICollectionView 一下用九宫格代称）废话不多说了，直接开始。
创建一个UICollectionView
首先，创建一个UICollectionView &，需要设置的几个代理&UICollectionViewDelegate,UICollectionViewDataSource,UICollectionViewDelegateFlowLayout。九宫格
跟UITableView类似，这里只是实现最简单的代理方法。
- (UICollectionView *)collectionView
if (_collectionView == nil) {
UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc]init];
_collectionView = [[UICollectionView alloc]initWithFrame:self.view.frame collectionViewLayout:flowLayout];
_collectionView.delegate =
_collectionView.dataSource =
[_collectionView registerClass:[CollectionViewCell class] forCellWithReuseIdentifier:CellIdentifier];
_collectionView.backgroundColor = [UIColor grayColor];
return _collectionV
其中_collectionView 是我创建的九宫格，CollectionViewCell 是我创建的自定义Cell，这个下面再讲。
上面我就碰到了了一个小问题，其实也是我自己不细心的原因，但是也是容易出错的地方：
UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc]init];
_collectionView = [[UICollectionView alloc]initWithFrame:self.view.frame collectionViewLayout:flowLayout];
上面的UICollectionViewFlowLayout ，这个类是九宫格用来实现自动布局的，注意千万不要写错，我就因为写错，写成了
UICollectionViewLayout （这个类我是直接点击去九宫格的初始化方法里面看到的）导致了九宫格显示不出来，其他地方也没有错，
调了好几遍，最后终于发现是这个类写错了，UICollectionViewFlowLayout 是UICollectionViewLayout 的子类。
好了，一个问题过去了。
准备UICollectionView 的数据
在实现九宫格的代理方法之前，先展示一下 需要的数据
@property (nonatomic, copy) NSMutableArray *dataSourceA
//宏是完全替换
#define CellWidthSpace
#define CellWidth
(kScreenWidth - (5 * CellWidthSpace))/4
#define CellLineSpace
self.dataSourceArray = [NSMutableArray arrayWithArray:@[@&image1.png&,@&image2.png&,@&image3.png&,&span style=&font-family: Arial, Helvetica, sans-&&@&image4.png&,@&image5.png&,@&image4.png&,@&image3.png&,@&image2.png&,@&image1.png&]];&/span&
dataSourceArray 是九宫格的数据，CellWidthSpace 是每行Cell之间的间距，CellLineSpace 是每列Cell之间的间距，这个
都是自己定义的。 kScreenWidth 是整个屏幕的宽度，重点是CellWidth， 我要显示4列的九宫格，间距需要5个，所以就是 屏宽度
减去5个空隙 后再除以4.就得到了每个Cell的 的宽度。
实现UICollectionView的代理
#pragma mark UICollectionViewDelegateFlowLayout
//设置每个Cell 的宽高
- (CGSize)collectionView:(UICollectionView *)collectionView
layout:(nonnull UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(nonnull NSIndexPath *)indexPath
return CGSizeMake(CellWidth, CellWidth);&span style=&white-space:pre&& &/span&
//设置Cell 之间的间距 （上，左，下，右）
- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section
return UIEdgeInsetsMake(CellLineSpace, CellWidthSpace, CellLineSpace, CellWidthSpace);
#pragma mark UICollectionViewDataSource
//设置九宫格Cell 的个数
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
return self.dataSourceArray.
//设置Cell
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
CollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:CellIdentifier forIndexPath:indexPath];
cell.imageName = self.dataSourceArray[indexPath.row];
cell.backgroundColor = [UIColor whiteColor];
#pragma mark UICollectionViewDelegate
//设置点击 Cell的点击事件
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
[collectionView deselectItemAtIndexPath:indexPath animated:YES];//取消选中
[self alertView:[NSString stringWithFormat:@&点击的是%ld&,indexPath.row]];
//这个不是必须的方法 是Cell 将要显示
- (void)collectionView:(UICollectionView *)collectionView willDisplayCell:(UICollectionViewCell *)cell forItemAtIndexPath:(NSIndexPath *)indexPath
cell.layer.transform = CATransform3DMakeScale(0.3, 0.3, 1);//缩放比例
[UIView animateWithDuration:0.8 animations:^{
cell.layer.transform = CATransform3DMakeScale(1, 1, 1);//还原为1
}];&span style=&white-space:pre&& &/span&
&span style=&font-family: Arial, Helvetica, sans-&&}&/span&
#pragma mark UIAlertView
- (void)alertView:(NSString *)message
UIAlertView *alert = [[UIAlertView alloc]initWithTitle:@&提示& message:message delegate:self cancelButtonTitle:@&取消& otherButtonTitles:@&确定&, nil];
[alert show];
上面就是九宫格的代理方法（没有列全，只是简单实现了UICollectionView）,上面的方法 看注释。
自定义UICollectionViewCell
重点是设置Cell的方法，我是使用了自定义Cell,这里就会显示出UICollectionView 与 UITableview 的不同.&
首先，UICollectionView 与UITableView 都有类似的
[collectionView dequeueReusableCellWithReuseIdentifier:CellIdentifier forIndexPath:indexPath];
这个是 Cell 的重用机制。UITableView 需要判断Cell是否 为空if (cell == nil) {
cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellIdentifier];
如果cell =nil 里面就可以使用 自定义 UITableViewCell 这里不再说了，但是UICollectionView 不需要判断Cell 是否为nil,可以使用系统
的UICollectionViewCell 也可以使用自定义的UICollectionViewCell，我们一般用的就是自定义的Cell .
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
CollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:CellIdentifier forIndexPath:indexPath];
cell.imageName = self.dataSourceArray[indexPath.row];
cell.backgroundColor = [UIColor whiteColor];
}CollectionViewCell 就是我自定义的Cell ,imageName 是自定义Cell 里面添加的图片的名字。
我们先来看一下自定义UICollectionViewCell 的文件，我实现的Cell 很简单就是添加了一个图片（这个自定义Cell 可以根据需要
自行设置），
#import &UIKit/UIKit.h&
@interface CollectionViewCell : UICollectionViewCell
@property (nonatomic, copy) NSString *imageN
#import &CollectionViewCell.h&
@interface CollectionViewCell ()
@property (nonatomic, strong) UIImageView *imageV
@implementation CollectionViewCell
- (instancetype)initWithFrame:(CGRect)frame
self = [super initWithFrame:frame];
if (self) {
- (void)setImageName:(NSString *)imageName
//注意cell里面的控件 使用的位置 是相对于cell 的位置的 所以使用bounds
_imageName = imageN
_imageView = [[UIImageView alloc]initWithFrame:self.bounds];
_imageView.image = [UIImage imageNamed:imageName];
[self addSubview:_imageView];
这里返回cell 的方法好像只能写
- (instancetype)initWithFrame:(CGRect)frame
- (instancetype)init
self = [super init];
if (self) {
}但是没有执行，好了。我们知道使用- (instancetype)initWithFrame:(CGRect)frame
去初始化一个自定义的Cell 。
自定义UICollectionViewCell 注意
这里我又连续碰到了2个问题，当然我上面粘贴出来出来的都是正确的。先说说第一个问题，我是在
- (instancetype)initWithFrame:(CGRect)frame
self = [super initWithFrame:frame];
if (self) {
self.imageView = [[UIImageView alloc]initWithFrame:self.bounds];
self.imageView.image = [UIImage imageNamed:self.imageName];
[self addSubview:_imageView];
这里面根据我传递过来的图片名字设置图片的，但是图片并没有显示出来。不知道你注意到了这个没有
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
CollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:CellIdentifier forIndexPath:indexPath];
cell.imageName = self.dataSourceArray[indexPath.row];
cell.backgroundColor = [UIColor whiteColor];
这个自定义UICollectionViewCell 是直接使用重用机制，调用系统的Cell 实例方法，但是我们设置自定义Cell 的图片信息，是在调用
过系统的重用的实例方法
，之后设置的。因为我们没有办法向自定义UITableViewCell 方法一样，实现我们自定义的实例方法。这就
导致了系统在调用我们 自定义UICollectionViewCell 的时候里面的imageName 字符串还是nil ，所以图片显示不出来。这里我使用了
重写setter方法，当然重写setter的时候可以传递过来一个模型的数据，来设置Cell 里面的显示的数据。
- (void)setImageName:(NSString *)imageName
//注意cell里面的控件 使用的位置 是相对于cell 的位置的 所以使用bounds
_imageName = imageN
_imageView = [[UIImageView alloc]initWithFrame:self.bounds];
_imageView.image = [UIImage imageNamed:imageName];
[self addSubview:_imageView];
}当我去设置 自定义Cell 里面的属性 iamgeName 的时候再去 添加图片。这样图片就能显示出来了。
最后一个问题，我在重写setter方法的时候，设置cell的UIImageView frame的时候 ，出现的。显示为UIImageView 的图片位置
不正确，能显示出来的只有2列，当我点击cell 提示的弹窗，提示信息跟我点击的cell图片不对应，最开始我以为是cell 的间距问题，
调了两次，发现还是调整不大。当我设置Cell 的背景颜色 为一个明显的突出颜色的时候，就看出来问题的原因了。cell 的位置是正确
的，错误的是cell的UIImageView 的位置。
问题出现前：
_imageView = [[UIImageView alloc]initWithFrame:self.frame];问题解决： _imageView = [[UIImageView alloc]initWithFrame:self.bounds];
问题的原因是，我设置UIImageView 的位置是
self.frame 这个位置是相对于整个UICollectionView 的，再添加自定义Cell 上面的时候，就不对了，那个位置是cell相对于父视图 UICollectionView的，添加到Cell 上面的，UIImageView 的父视图是Cell 而不是UICollectionView，所以设置图片视图UIImageView 的位置的时候应该用相对于Cell 位置的self.bounds
以上，就是我在实现UICollectionView 的时候碰到的小问题，以及自定义UICollectionViewCell 。啦啦啦啦
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：16950次
排名：千里之外
原创：23篇
(1)(4)(8)(3)(4)(6)(5)(1)匿名用户不能发表回复！|
每天回帖即可获得10分可用分！小技巧：
你还可以输入10000个字符
(Ctrl+Enter)
请遵守CSDN，不得违反国家法律法规。
转载文章请注明出自“CSDN（www.csdn.net）”。如是商业用途请联系原作者。CollectionView重用问题 - 简书
CollectionView重用问题
collectionView
通过- (void)prepareForReuse是重用的属性置空。
通过collectionViewCell下标（indexPath.row）使cell不重用
通过判断cell防止重用下面看代码cell每次重用都会走着个方法 从这里面取出控件进行重用， 我们可以重写这个方法 ，将其控件置空就不会导致重用- (void)prepareForReuse {
NSLog(@"MyCollection9999999%s --- %@", __func__, self);
通过cell下标进行防止重用效果先写一个bool类型进行判断的一个属性
BF9AF3CA-2F58-4F8D-8A3D-C99B30005B0C.png
在collectionView点击方法里面拿到当前的cell在将其bool类型的属性将其取反使其没点击能有yes/no状态
855C16E6-960A--9C272645CEBC.png
在将cell的属性改成响应的取反效果cell其属性：
5DB9-4E74-B564-8AAA2398918C.png
在- (id)initWithFrame:(CGRect)frame方法里将属性设置好
6F79DA84-24D0-4D1F-AD8D-C.png
在常态的时候显示常态状态下的图片选中状态下显示选中时的图片接下来就是在cell创建的方法里- (UICollectionViewCell )collectionView:(UICollectionView )collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath将bool类型行进判断
FA5E6ED8-53-9845FABF7308.png
判断YES/NO来改变其button状态下显示的图片每次上下拉cell的时候都会重用走这个方法点击cell将其YES时每次Bool类型都是yes都会在响应下标下改变相对应button的状态不会造成重用的现象
第三种方法不推荐使用，他不会使cell重用，会拉cell一次都创建新的cell，使之前的cell不会重新利用，不会保留之前的状态新创建一个可变的字典每次先从字典中根据indexPath取去唯一标识NSString *identifier = [_cellDic objectForKey:[NSString stringWithFormat:@"%@", indexPath]];如果取出的唯一标示符不存在，则初始化唯一标示符，并将其存到字典里，对应唯一标示符注册cellif (identifier == nil) {
identifier = [NSString stringWithFormat:@"%@%@", DayCell, [NSString stringWithFormat:@"%@", indexPath]];
[_cellDic setValue:identifier forKey:[NSString stringWithFormat:@"%@", indexPath]];
注册cell[self.collectionView registerClass:[CalendarCollectionViewCell class]
forCellWithReuseIdentifier:identifier];
创建cellCalendarCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:identifier forIndexPath:indexPath];
下面就可以对cell做你想要做的事情操作等return cell；
讨论技术方法面加本人QQ 技术讨论交流