UICollectionView的基础用法

UICollectionView的基础用法

UICollectionView类似UITableView，我们对UITableView很熟悉，可以类比tableView学习。类比而已，肯定有不同之处了。

UICollectionView继承UIScrollView，有两个代理方法和一个UICollectionViewDelegateFlowLayout,今天不讲UICollectionViewDelegateFlowLayout这个，今天只讲UICollectionView的基础用法。

用UICollectionView值得注意的三点：

1.初始化的时候一定要给一个UICollectionViewFlowLayout对象，告诉UICollectionView怎么样去显示，如果不传这个UICollectionViewFlowLayout，UICollectionView是显示不出来的，这个和UITableView不一样。

2.如果要设置一个headerView（头视图），那么要设置 UICollectionViewFlowLayout对象的HeaderReferenceSize，就是这个头视图的尺寸大小，这个和table也不一样。另外还要注册头视图，如果不注册的话，也是加不上去的。具体代码这样的：
//这是flowLayout对象的头视图尺寸大小
[flowLayout setHeaderReferenceSize:CGSizeMake(self.view.frame.size.width, self.view.frame.size.width*3/4)];
//注册头视图以便复用头视图
[cv registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@”WMBannerView”];

3.注册cell。这个UICollectionCell和UITableViewCell还不一样，系统没有给出默认的样式，类比UITableViewCell可以知道，UITableViewCell系统给了3个样式，里面放置了UILabel或者UIImageView可以使用。但是UICollectionCell不同，一般我们自己要用纯代码写一个UICollectionCell或者直接用XIB做一个UICollectionCell，本人喜欢用XIB做cell，简单快捷，凸显XIB优势。 注册代码如下：
[cv registerNib:[UINib nibWithNibName:@”CollectionViewCell” bundle:nil] forCellWithReuseIdentifier:@”cell”];

讲完三点注意事项之后，上代码完成一个cv，cv上有一个广告轮播图。

#import "CVOfLocalImageViewController.h"
#import "CollectionViewCell.h"
#import "WMBannerView.h"
@interface CVOfLocalImageViewController ()<UICollectionViewDataSource,UICollectionViewDelegate>{
UICollectionView *cv;
NSMutableArray *dataSource;
WMBannerView *wmView;

}

@end

@implementation CVOfLocalImageViewController
- (instancetype)init
{
self = [super init];
if (self) {
    dataSource = [[NSMutableArray alloc]init];
}
return self;
}

- (void)viewDidLoad {
self.view.backgroundColor = [UIColor whiteColor];
[super viewDidLoad];
/*
 本地图片测试
 */
NSArray *imagesArray = @[[UIImage imageNamed:@"ad1.jpg"],
                         [UIImage imageNamed:@"ad2.jpg"],
                         [UIImage imageNamed:@"ad3.jpg"],
                         [UIImage imageNamed:@"ad4.jpg"],
                         [UIImage imageNamed:@"ad5.jpg"]];
wmView = [[WMBannerView alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.width*3/4) withURLArrayOrImagesArray:imagesArray];
wmView.pageControlAlignment = WMPageContolAlignmentCenter;
wmView.animationDuration = 1.0;
[wmView startWithTapActionBlock:^(NSInteger index) {
    NSLog(@"点击了第%@张",@(index));
}];
[self initCollectionView];
}

-(void)initCollectionView{
UICollectionViewFlowLayout *flowLayout=[[UICollectionViewFlowLayout alloc] init];
[flowLayout setScrollDirection:UICollectionViewScrollDirectionVertical];
[flowLayout setHeaderReferenceSize:CGSizeMake(self.view.frame.size.width, self.view.frame.size.width*3/4)];

cv = [[UICollectionView alloc]initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height) collectionViewLayout:flowLayout];
cv.delegate = self;
cv.dataSource = self;
cv.backgroundColor = [UIColor whiteColor];
[cv registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader  withReuseIdentifier:@"WMBannerView"];
[cv registerNib:[UINib nibWithNibName:@"CollectionViewCell" bundle:nil] forCellWithReuseIdentifier:@"cell"];
[self.view addSubview:cv];

}
#pragma mark
#pragma mark collectionDelegate
    //返回UICollectionView有几个section
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
return 1;
}
//返回UICollectionView每个section有几行
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
return 21;
}
    //返回UICollectionViewCell的代理方法，处理复用cell，和UITableView差不多

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
CollectionViewCell *cell = (CollectionViewCell *)[collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];
cell.centerLabel.text = [NSString stringWithFormat:@"第%ld个cell",indexPath.row];
cell.backgroundColor = [UIColor magentaColor];

return cell;


}
//处理复用的头视图和脚视图的代理方法

-(UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath{
if (kind == UICollectionElementKindSectionHeader){//处理头视图
    UICollectionReusableView *headerView = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"WMBannerView" forIndexPath:indexPath];
    [headerView addSubview:wmView];
    return headerView;

}
else{
    return nil;
}
}

//调节每个item的大小size代理方法
-(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
return CGSizeMake((self.view.frame.size.width-5*6)/3, (self.view.frame.size.width-5*4)/3);

}

//调节每个item的edgeInsets代理方法
-(UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section
{
return UIEdgeInsetsMake(0, 0, 0, 0);
}
//点击每个item事件的代理方法
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
NSString *index = [NSString stringWithFormat:@"%ld",(long)indexPath.row];
}

@end

代码地址：https://github.com/zhengwenming/WMBannerView

另外博主维护一个iOS开发技术支持群：479259423，进群必须改名，群名片格式：城市-iOS-名字，例如广州-iOS-文明。