首先我们先创建一个CollectionViewCell
然后我们在.h里写
@property (nonatomic,retain)UIImageView *imageView; // 显示图片
@property (nonatomic,retain)UILabel *titleLabel; // 显示文字
然后在.m里写
(UIImageView *)imageView{
if (!_imageView) {
_imageView = [[UIImageView alloc] initWithFrame:self.viewForFirstBaselineLayout.bounds];
[self.contentView addSubview:_imageView];
}return _imageView;
}(UILabel *)titleLabel{
if (!_titleLabel) {
_titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, CGRectGetHeight(self.bounds) - 30, CGRectGetWidth(self.bounds), 30)];
[self.contentView addSubview:_titleLabel];
}return _titleLabel;
}
最后我们先在viewcontroller里导入CollectionViewCell头文件
import "CollectionViewCell.h"
@interface ViewController ()<UICollectionViewDelegate,UICollectionViewDataSource,UICollectionViewDelegateFlowLayout>
@property (nonatomic,retain)NSDictionary *itemDic; // 承载一个item上面显示的图片和文字
@property (nonatomic,retain)NSMutableArray *allDataArray; // 成方所有的item上显示的内容，其实就是盛放小字典
@end
@implementation ViewController
(NSMutableArray *)allDataArray{
if (!_allDataArray) {
_allDataArray = [[NSMutableArray alloc]init];
}return _allDataArray;
}-
(void)viewDidLoad {
[super viewDidLoad];
for (int i = 1; i < 20; i++) {NSDictionary *itemDic = [[NSDictionary alloc] initWithObjectsAndKeys: [NSString stringWithFormat:@"%d.jpg",i],@"imageName", [NSString stringWithFormat:@"我是第%d个妹子",i] ,@"textLable", nil]; [self.allDataArray addObject:itemDic];}
self.navigationItem.title = @"github";
// 由于初始化集合视图需要布局对象，所以我们才需要初始化布局对象，并且设置它的某些属性
// 这个是系统提供的布局类，可以布局一些比较规则的布局。
UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc] init];
// 设置每个item的大小，
flowLayout.itemSize = CGSizeMake(120, 160);
// flowLayout.itemSize = CGSizeMake(CGRectGetWidth(self.view.frame), CGRectGetHeight(self.view.frame));
// 设置列的最小间距
flowLayout.minimumInteritemSpacing = 10;
// 设置最小行间距
flowLayout.minimumLineSpacing = 15;
// 设置布局的内边距
flowLayout.sectionInset = UIEdgeInsetsMake(15, 15, 15, 15);
// 滚动方向
flowLayout.scrollDirection = UICollectionViewScrollDirectionVertical;
// flowLayout.scrollDirection = UICollectionViewScrollDirectionHorizontal;UICollectionView *collectionView = [[UICollectionView alloc] initWithFrame:self.view.bounds collectionViewLayout:flowLayout];
// 如果未设置背景颜色是黑色设置背景颜色
collectionView.backgroundColor = [UIColor whiteColor];
// 设置代理
collectionView.delegate = self;
collectionView.dataSource = self;
// [collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:@"CELL"];
[collectionView registerClass:[CollectionViewCell class] forCellWithReuseIdentifier:@"CELL"];[self.view addSubview:collectionView];
}
// 返回分区数
-
(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
return 1;
}
// 每个分区多少个item
-
(NSInteger )collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
return _allDataArray.count;
} (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
// UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"CELL" forIndexPath:indexPath];
CollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"CELL" forIndexPath:indexPath];
// 取出每个item所需要的数据
NSDictionary *dic = [_allDataArray objectAtIndex:indexPath.item];
// 取出图片名称
NSString *imageString = [dic objectForKey:@"imageName"];
cell.imageView.image = [UIImage imageNamed:imageString];
// 取出文字
NSString *textString = [dic objectForKey:@"textLable"];
cell.titleLabel.text = textString;
cell.backgroundColor = [UIColor colorWithRed:arc4random()%256/256.0 green:arc4random()%256/256.0 blue:arc4random()%256/256.0 alpha:1];
return cell;
}
// 点击图片的方法
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
NSLog(@"我点击了%ld图片！！！",indexPath.item + 1);
}
