自定义的UICollectionViewCell 的步骤:
1. collectionView.delegate = self;
2. 设置 @interface ViewController ()3. #pragma mark -监听按钮点击
-(void)collectionView: (UICollectionView *)collectionView didSelectedItemAtIndexPath:( NSIndexPath *)indexPath
{
NSLog(@“——%zd”,indexPath.item);
}
4. 自定义cell XMGImageCell 继承自UICollectionViewCell 最好也设置一下XIB 文件。
5. 拖入一个imageview 放入cell 设置约束 cell 设置标识identifier(属性4) 例如:photo
6. 把一个image view 拖入XMGImageCell 项目中 取名imageView; (@property(weak, nonatomic) IBOutlet UIImageView * imageView;)
7. 拖入图片数据,放入xcassets
8.导入文件 #import “XMGPhotoCell.h”
9.设置 static NSString * const XMGPhotoId =@“photo”;
10. viewDidLoad 中
//注册 [collectionView registerNib:[UINib nibWithNibName:NSStringFromClass([XMGPhotoCell class]) bundle:nil ] forCellWithReuseIdentifier: XMGPhotoId]
11. XMGPhotoCell.h 中 设置属性 @property (nonatomic, copy )NSString *imageName;
12. // 设置cell 的内容
-(NSIntege) collectionView: (UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
// 有多少个cell
return 20 ;
}
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
//创建cell
UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:XMGCellId forIndexPath:indexPath];
//cell的背景颜色
//cell.backgroundColor =[UIColor orangeColor];
cell.imageName = [NSString stringWithFormat: @"zd”,indexPath.item + 1];
return cell;
}
@end
13. - (void)setImageName:(NSString *)imageName
{
_imageName = [imageName copy];
self.imageView.image = [UIImage imageNamed: imageName];
}
写到这 就可以正常显示图片到cell 中了 还有些细节处理 往下看
需求: 要让图片四周边框要有白色间距10:
解决:可以设置自定义cell imageview 与边的约束。
解决方法2 : 给imageView 加一个图层边框就可以了。
-(void)awakeFromNib {
self.imageView.layer.borderColor = [ UIColor whiteColor].CGColor ;
self.imageView.layer.borderWhite = 10;
}