UI课程21 集合视图UICollectionView

UICollectionView中的cell的cell的布局要比tableview复杂，需要一个类描述集合视图的布局和行——UICollectionViewLayout
创建集合视图的步骤：
1）使用系统的布局UICollectionViewFlowLayout
2）设置代理，设置数据源
3）设定自定义cell

UICollectionViewLayout是基类，使用它的子类UICollectionViewFlowLayout进行布局

1.UICollectionViewDelegateFlowLayout
通过UICollectionViewDelegateFlowLayout布局协议，可以对每个item进行设置，实现类似瀑布流的效果

self.view.backgroundColor = [UIColor colorWithWhite:0.702 alpha:1.000];
    //建立一个布局（必须）
    UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc] init];
    //设置滚动方向
    //flowLayout.scrollDirection = UICollectionViewScrollDirectionHorizontal;
    flowLayout.scrollDirection = UICollectionViewScrollDirectionVertical;

    //设置item大小
    flowLayout.itemSize = CGSizeMake(70, 70);

    //横向item之间的间隔
    //flowLayout.minimumInteritemSpacing = 20;//表示横向最小间隔，比它大也可以
    //竖向间隔（行与行之间）
    //flowLayout.minimumLineSpacing = 50;

    //天地左右（上下左右与屏幕的距离）
    flowLayout.sectionInset = UIEdgeInsetsMake(20, 20, 20, 20);


    //创建一个集合视图
    UICollectionView *collectionView = [[UICollectionView alloc] initWithFrame:[UIScreen mainScreen].bounds collectionViewLayout:flowLayout];
    collectionView.backgroundColor = [UIColor whiteColor];

    //设置代理
    collectionView.delegate = self;
    collectionView.dataSource = self;

    [self.view addSubview:collectionView];

    //注册cell（重用的都要注册）
    [collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:cellId];
    //注册自定义cell
    [collectionView registerClass:[CustomCell class] forCellWithReuseIdentifier:customCellId];


    //注册增补视图
    //区头
    [collectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:headerReuseId];
    //区尾
    [collectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:footerReuseId];


    //区头，区尾 的大小
    flowLayout.headerReferenceSize = CGSizeMake(10, 10);//只有高起作用
    flowLayout.footerReferenceSize = CGSizeMake(20, 20);

#pragma mark - 区头，区尾（每个组的）
- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath{

    //区头
    UICollectionReusableView *header = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:headerReuseId forIndexPath:indexPath];
    header.backgroundColor = [UIColor cyanColor];

    //区尾
    UICollectionReusableView *footer = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:footerReuseId forIndexPath:indexPath];
    footer.backgroundColor = [UIColor yellowColor];

    if ([kind isEqualToString:UICollectionElementKindSectionHeader]) {
        return header;
    }

    return footer;
}

自定义cell中

//super是一个编译器指令，给父类发送消息。没有父类，子类就没有意义
- (instancetype)initWithFrame:(CGRect)frame{

    //self = [super initWithFrame:frame];的意义：
    //1.初始化子类和父类公有的实例变量（子类继承的）
    //2.接受初始化结果
        //1）如果一个类的父类不存在，返回结果为nil,实例变量的初始化将不会执行。（不允许初始化无父类的实例变量）
        //2）如果一个类的父类在对内存中数据进行初始化的时候失败，子类没有意义去初始化变量。（不做无意义的计算）

    self = [super initWithFrame:frame];
    if (self) {
        [self setUp];
    }
    return self;
}

//添加视图

- (void)setUp{
    [self.contentView addSubview:self.imgView];
}

//重写视图布局方法
//collectionView向重用池取出cell的时候，因为cell的尺寸不一致，无法判定取出的cell的尺寸是否正确（同种cell同一个重用标识符导致的现象）。重写layoutSubviews可以在每次绘制cell的时候，将当前collectionView的尺寸重新复制给cell，保证cell尺寸绘制正确
- (void)layoutSubviews{
    [super layoutSubviews];

    self.imgView.frame = self.contentView.bounds;
}

#pragma mark - 懒加载
- (UIImageView *)imgView{
    if (nil == _imgView) {
        _imgView = [[UIImageView alloc] initWithFrame:self.bounds];
        _imgView.backgroundColor = [UIColor magentaColor];
        //_imgView.image = [UIImage imageNamed:@"image"];
    }
    return _imgView;
}