首先新建工程
然后在xib中添加UICollectionView控件
然后
#import
@interface CollectionViewController : BaseViewController
@property (strong, nonatomic) IBOutlet UICollectionView *collectionView;
@property (strong, nonatomic) NSArray *items;
@end
//
// CollectionViewController.m
// StudyiOS
//
// Created by ZhangYiCheng on 12-12-13.
// Copyright (c) 2012年 ZhangYiCheng. All rights reserved.
//
#import "CollectionViewController.h"
#import "CollectionHeadView.h"
#import "TESTCollectionViewController.h"
@interface CollectionViewController ()
@end
@implementation CollectionViewController
- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
{
self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
if (self) {
}
return self;
}
- (void)viewDidLoad
{
[super viewDidLoad];
// 注册可重用视图
[self.collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:@"cell"];
[self.collectionView registerClass:[CollectionHeadView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"head"];
self.collectionView.dataSource = self;
self.collectionView.delegate = self;
//这里面的itmes是加载的图片
self.items = @[@"blue", @"blue", @"blue", @"girl",@"blue", @"red", @"green", @"girl",@"blue", @"red", @"green", @"girl",@"blue",@"blue"];
}
- (void)didReceiveMemoryWarning
{
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
- (void)viewDidUnload {
[self setCollectionView:nil];
[super viewDidUnload];
}
#pragma mark - UICollectionViewDataSource
// 返回section的数量
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView {
return 1;
}
// 返回在一个给定section里的cell数量
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
return [self.items count];
}
// 返回在某个cell。与table view的cell类似
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
// 得到cell
UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];
// 系统的UICollectionViewCell只能改变背景图,你应该自定义一个class继承UICollectionViewCell
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 80, 120)];
imageView.image = [UIImage imageNamed:self.items[indexPath.row]];
cell.backgroundView = imageView;
//cell上添加控件
UILabel *label=[[UILabel alloc]initWithFrame:CGRectMake(0, 0, 30, 30)];
label.text=@"aaa";
[cell addSubview:label];
return cell;
}
// 返回headview或footview
- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath {
CollectionHeadView *headView = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"head" forIndexPath:indexPath];
return headView;
}
#pragma mark - UICollectionViewDelegate
// 选中某个cell
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath {
NSLog(@"didSelectItemAtIndexPath:%d-%d", indexPath.section, indexPath.row);
//测试cell的点击事件
TESTCollectionViewController *test=[[TESTCollectionViewController alloc]init];
[self.navigationController pushViewController:test animated:YES];
}
#pragma mark - UICollectionViewDelegateFlowLayout
// 定义cell的size
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
CGSize size = CGSizeMake(80, 120);
return size;
}
// 定义section的边距
- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section {
return UIEdgeInsetsMake(20, 20, 20, 20);
}
// 定义headview的size
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section {
return CGSizeMake(320, 40);
}
// 定义上下cell的最小间距
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section {
return 20;
}
// 定义左右cell的最小间距
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section {
return 20;
}
@end
添加了自定义header的类,自定义的header需要继承UICollectionReusableView
//
// CollectionHeadView.h
// StudyiOS
//
// Created by ZhangYiCheng on 12-12-13.
// Copyright (c) 2012年 ZhangYiCheng. All rights reserved.
//
#import
@interface CollectionHeadView : UICollectionReusableView
@property (strong, nonatomic) UILabel *label;
@end
//
// CollectionHeadView.m
// StudyiOS
//
// Created by ZhangYiCheng on 12-12-13.
// Copyright (c) 2012年 ZhangYiCheng. All rights reserved.
//
#import "CollectionHeadView.h"
@implementation CollectionHeadView
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
_label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 320, 40)];
_label.text = @"This is HeadView";
_label.textAlignment = NSTextAlignmentCenter;
_label.font = [UIFont systemFontOfSize:20];
_label.backgroundColor = [UIColor colorWithWhite:0.7 alpha:0.6];
[self addSubview:_label];
}
return self;
}
/*
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect
{
// Drawing code
}
*/
@end