UICollectionViewController xcode6.1 自定义Cell

本文转载至 http://blog.csdn.net/daleiwang/article/details/40423219

UICollectionViewContAutolayoutstoryboard自定义RootCollectionViewCe

虽然这个早已不是新东西了，但是之前项目中一直没有机会用，只知道跟tableView原理相同。

弄了个自定义UICollectionViewCell的小DEMO：

（1）在storyboard中拖拽一个UICollectionViewController：

（2）新建RootCollectionViewController继承自UICollectionViewController

1. #import "RootCollectionViewController.h"
2. #import "RootCollectionViewCell.h"
3. @interface RootCollectionViewController ()
4. @end
5. @implementation RootCollectionViewController
6. - (void)viewDidLoad {
7. [super viewDidLoad];
8. self.clearsSelectionOnViewWillAppear = NO;
9. }
10. - (void)didReceiveMemoryWarning {
11. [super didReceiveMemoryWarning];
12. }
13. #pragma mark <UICollectionViewDataSource>
14. - (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView {
15. return 1;
16. }
17. - (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
18. return 20;
19. }
20. - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
21. static NSString * CellIdentifier = @"GradientCell";
22. RootCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:CellIdentifier forIndexPath:indexPath];
23. cell.backgroundColor = [UIColor colorWithRed:((110 * indexPath.row) / 255.0) green:((220 * indexPath.row)/255.0) blue:((330 * indexPath.row)/255.0) alpha:1.0f];
24. [cell.lab setText:@"xxxx"];
25. [cell.frontView setBackgroundColor:[UIColor redColor]];
26. return cell;
27. }
28. #pragma mark <UICollectionViewDelegate>
29. @end

（3）新建RootCollectionViewCell继承自UICollectionViewCell，头文件如下，自定义两个控件

1. #import <UIKit/UIKit.h>
2. @interface RootCollectionViewCell : UICollectionViewCell
3. @property(nonatomic,weak)IBOutlet UILabel *lab;
4. @property(nonatomic,weak)IBOutlet UIView *frontView;
5. @end

（4）storyboard操作：

点击CollectionViewController，设置Class：

点击CollectionCell设置Class：

拖动一个View和lab到CollectionView上，设置约束为固定宽高上下居中：

点击左侧的CollectionCell,，将IBOutlet，连接到lab和frontView上：

设置大小及边距，当然了，xcode6以后，也可以根据不同的屏幕设置相应SizeClass下的边距：

（5）运行效果: