iOS 开发之UICollectionView使用详解

自ios6.0苹果推出了新的滚动视图CollectionVIew，它提供了更加丰富的布局，关于CollectionVIew的原理我就不给大家聊了，主要聊聊它的使用

首先CollectionView的使用主要有几个概念：

1.item（这个同tableView的item的概念差不多

2.section（等同于tableView中的section）

3.supplementarview （可以理解为section的页眉页脚的概念）

4.layout （这个是collectionView的核心，这个主要来决定collectionView布局

下面我来通过代码来给大家演示

这是我的文件列表AppDelegate、RootViewController我就不解释了

MYCollectionViewFlowLayout：存储着我的CollectionView的布局信息

MYCollectionViewCell：这个我想大家都能看懂，就是我的自定义cell

MYCollectionReusableHeaderView：这是我的自定义页眉（可以理解为页眉）

MYCollectionReusableFooterView：这是我的自定义页脚（可以理解为页脚）

RootViewController中开始创建CollectionView

头文件和协议注册略

<pre name="code" class="html"><span style="font-family: Arial, Helvetica, sans-serif;">- (void)viewDidLoad</span><span style="font-family: Arial, Helvetica, sans-serif;">{</span>

    [super viewDidLoad];
    // Do any additional setup after loading the view.
    //设置布局
    UICollectionView *collectionView = [[UICollectionView alloc] initWithFrame:self.view.bounds collectionViewLayout:[[MYCollectionViewFlowLayout alloc] init]];
    //注册自定义cell
    [collectionView registerClass:[MYCollectionViewCell class] forCellWithReuseIdentifier:@"identifier"];
    ///注册头SupplementaryViews
    [collectionView registerClass:[MYCollectionReusableHeaderView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"head"];
    ///注册尾SupplementaryViews
    [collectionView registerClass:[MYCollectionReusableFooterView class] forSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:@"foot"];
    //设置背景颜色
    collectionView.backgroundColor = [UIColor greenColor];
    
    collectionView.delegate = self;
    collectionView.dataSource = self;
    
    [self.view addSubview:collectionView];
}

viewD idLoad中创建CollectionVIew并且设置它的布局、注册自定义cell、supplementaryview

#pragma mark-
#pragma mark UICollectionViewDataSource

//每个section中有多少个item
- (NSInteger)collectionView:(UICollectionView *)view numberOfItemsInSection:(NSInteger)section{
    return 10;
}


//有多少个section
-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
    return 2;
}


//设置对应的cell上现实的内容
- (UICollectionViewCell *)collectionView:(UICollectionView *)cv cellForItemAtIndexPath:(NSIndexPath *)indexPath;
{
    //从重用队列里取出一个cell
    MYCollectionViewCell *cell = (MYCollectionViewCell *)[cv dequeueReusableCellWithReuseIdentifier:@"identifier"
                                                           forIndexPath:indexPath];
    
    if (!cell) {
        NSLog(@"what ? cell is nil ? It's joke !");
        return nil;
    }
    
    return cell;
}


//设置SupplementaryViews
- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath{
    UICollectionReusableView *view = nil;
    if ([kind isEqualToString:UICollectionElementKindSectionHeader]) {
        
        MYCollectionReusableHeaderView * view = [collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:@"head" forIndexPath:indexPath];
        return view;
    }
    if ([kind isEqualToString:UICollectionElementKindSectionFooter]) {
        
        MYCollectionReusableFooterView * view = [collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:@"foot" forIndexPath:indexPath];
        return view;
    }
    return view;
}

 UICollectionViewDataSource中前三个协议我就不解释了，相信大家通过tableView的知识便能推理出来，第四条是用来设置页眉页脚的，kind标识类型也就是页眉或者页脚，if判断它是创建页眉还是页脚，用对应的自定义类进行创建。

#pragma mark-
#pragma mark UICollectionViewDelegateFlowLayout
//设置没个item的不同尺寸
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
    NSInteger volue = arc4random() % 100;
    CGSize size = CGSizeMake(150, 150 + volue);
    return size;
}

UICollectionViewDelegateFlowLayout只是对UICollectionViewDelegate进行了一些扩展，以上这条是随机设置没个item的高度（宽度固定位150）

MYCollectionViewCell继承于UICollectionViewCell、MYCollectionReusableHeaderView和MYCollectionReusableFooterView都继承于UICollectionReusableView，这三个都是自定义的界面，这个大家随便写，主要给大家看看MYCollectionViewFlowLayout，它继承于UICollectionViewFlowLayout

#define ITEM_SIZE 150.0
-(id)init
{
    self = [super init];
    if (self) {
        //设置item大小
        self.itemSize = CGSizeMake(ITEM_SIZE, ITEM_SIZE);
        //设置转向
        self.scrollDirection = UICollectionViewScrollDirectionVertical;
        //设置section边界值  边界值为逆时针顺序
        self.sectionInset = UIEdgeInsetsMake(0, 5, 0, 5);
        //设置每行间距
        self.minimumLineSpacing = 20.0;
        //头SupplementaryView尺寸
        self.headerReferenceSize = CGSizeMake(50, 10);
        //尾SupplementaryView尺寸
        self.footerReferenceSize = CGSizeMake(50, 10);
        
    }
    return self;
}

我将这些属性设置在自定义的flowlayout中，当然也可以直接对实例化的对象进行设置，注释写的很清楚了，小弟下班了~~拜拜