本文地址:http://blog.csdn.net/zhaoyabei/article/details/40158015,转载注明出处,谢谢。
UICollectionView在2012年被提出,已经不是什么新技术了,在此只是做一下简单的实现。
集合视图:UICollectionView
UICollectionView和UITableView类似,它也是datasource和delegate设计模式的:datasource为view提供数据源,告诉view要显⽰示些什么东⻄以及如何显示它们,delegate提供一些样式的⼩细节以及⽤户交互的响应。
在collectionView中,对于cell的布局比较复杂,专⻔使⽤了⼀个类来对collectionView的布局和行为进⾏描述,这就是 UICollectionViewLayout。UICollectionViewLayout是抽象基类,使用时用其子类新建对象。最常用的UICollectionViewLayout子类就是UICollectionViewFlowLayout(Apple提供)了。Flow Layout简单说是一个直线对齐的layout,一般的如优酷客户端等瀑布流样式使用它就能搞定。当然UICollectionViewLayout也有其他有趣的子类,如堆叠布局、圆形布局、Cover
Flow布局等。
这里使用的是UICollectionViewFlowLayout实现一个视频播放器的布局。其中的数据解析大家可以忽略或添加自己想要的图片等,主要是讲布局的形成。
环境:Xcode6,arc, 纯代码
viewDidLoad方法
//在viewDidLoad中注册需要使用的类
//header视图
[_collectionView registerClass:[HeadView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"header"];
//具备滚动图片的item(cell)
[_collectionView registerClass:[ScrollCollectionViewCell class] forCellWithReuseIdentifier:@"scrollCell"];
//单张图片的item(cell)
[_collectionView registerClass:[CustomCollectionViewCell class] forCellWithReuseIdentifier:@"cell"];
viewController中的其他方法
#pragma mark 集合视图
//返回每个分区的item数
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
if (section==0) {
return 1;
}
NSString*category=[_allCategory objectAtIndex:section];
if ([_allVideoDic objectForKey:category]) {
return [[_allVideoDic objectForKey:category] count];
}else return 0;
}
//生成item
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
//第一个分区只有一个item,且与其他分区不同
if (indexPath.section==0) {
ScrollCollectionViewCell*scrollCell=[collectionView dequeueReusableCellWithReuseIdentifier:@"scrollCell" forIndexPath:indexPath];
[scrollCell initWithArray:[_allVideoDic objectForKey:@"ad"]];
return scrollCell;
}
else{//其他分区
CustomCollectionViewCell*cell=[collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];
VideoModel*video=[[_allVideoDic objectForKey:[_allCategory objectAtIndex:indexPath.section]]objectAtIndex:indexPath.row];
[cell initDataWith:video];
return cell;
}
return nil;
}
//返回item的大小
-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
if (indexPath.row==0&&indexPath.section==0) {
return CGSizeMake(Width, 200);
}
return CGSizeMake(80, 130);
}
//返回分区数
-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
return [_allCategory count];
}
//返回HeaderView的大小
-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section{
if (section==0) {
return CGSizeMake(Width, 0);
}else return CGSizeMake(Width, 20);
}
//返回每个分区的headerView
-(UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath{
if (indexPath.section!=0&&[kind isEqualToString:UICollectionElementKindSectionHeader]) {
static NSString *reuseIdentifier=@"header";
HeadView*view=[collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:reuseIdentifier forIndexPath:indexPath];
NSString*title;
switch (indexPath.section) {
case 1:
title=@"今日推荐";
break;
case 2:
title=@"国内微影";
break;
case 3:
title=@"国际微影";
break;
default:
break;
}
view.title=title;
return view;
}
return nil;
}
效果图: