自定義的UICollectionViewCell 的步驟：

1.  collectionView.delegate = self；
2. 設(shè)置 @interface ViewController ()3. #pragma mark -監(jiān)聽按鈕點(diǎn)擊

-(void)collectionView: (UICollectionView *)collectionView didSelectedItemAtIndexPath:( NSIndexPath *)indexPath

{

NSLog(@“——%zd”,indexPath.item);

}

4. 自定義cell      XMGImageCell 繼承自UICollectionViewCell  最好也設(shè)置一下XIB 文件。

5. 拖入一個(gè)imageview 放入cell 設(shè)置約束    cell 設(shè)置標(biāo)識identifier(屬性4) 例如：photo

6. 把一個(gè)image view 拖入XMGImageCell 項(xiàng)目中 取名imageView;      (@property(weak, nonatomic) IBOutlet UIImageView * imageView;)

7. 拖入圖片數(shù)據(jù)，放入xcassets

8.導(dǎo)入文件  #import “XMGPhotoCell.h”

9.設(shè)置  static NSString * const  XMGPhotoId =@“photo”;

10. viewDidLoad 中

//注冊  [collectionView registerNib:[UINib nibWithNibName:NSStringFromClass([XMGPhotoCell class]) bundle:nil ] forCellWithReuseIdentifier: XMGPhotoId]

11. XMGPhotoCell.h  中 設(shè)置屬性 @property (nonatomic, copy )NSString *imageName;

12. // 設(shè)置cell 的內(nèi)容

-(NSIntege) collectionView: (UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section

{

// 有多少個(gè)cell

return 20 ;

}

-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath

{

//創(chuàng)建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 中了  還有些細(xì)節(jié)處理  往下看

需求： 要讓圖片四周邊框要有白色間距10：

解決：可以設(shè)置自定義cell imageview 與邊的約束。

解決方法2 ： 給imageView 加一個(gè)圖層邊框就可以了。

-（void）awakeFromNib {

self.imageView.layer.borderColor = [ UIColor whiteColor].CGColor ;

self.imageView.layer.borderWhite =  10;

}