UICollectionView的简单使用

2018-12-15  本文已影响0人  yyggzc521

UICollectionView没有UITableView使用的频繁,所以偶尔使用的时候一下子想不起来怎么使用,因此记录一下使用方法,以备后来使用。

- (UICollectionView *)collectionView {
    if (!_collectionView) {
        UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc] init];
        flowLayout.itemSize = CGSizeMake(kScreenWidth / 4, 75);//item的尺寸都一样的时候使用
        flowLayout.minimumLineSpacing = 0;
        flowLayout.minimumInteritemSpacing = 0;
        flowLayout.scrollDirection = UICollectionViewScrollDirectionVertical;//滚动方向
        //设置headerView的尺寸大小
       flowLayout.headerReferenceSize = CGSizeMake(kScreenWidth, 100);
        
        _collectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 0, kScreenWidth, kScreenHeight - KNavBarHeight) collectionViewLayout:flowLayout];
        _collectionView.showsVerticalScrollIndicator = NO;
        _collectionView.showsHorizontalScrollIndicator = NO;
//        _collectionView.pagingEnabled = YES;
//        _collectionView.bounces = NO;
        _collectionView.backgroundColor = [UIColor whiteColor];
        _collectionView.delegate = self;
        _collectionView.dataSource = self;
        [_collectionView registerClass:[ZCWeekCollectionViewCell class] forCellWithReuseIdentifier:@"ZCWeekCollectionViewCell"];//注册cell
        
        [_collectionView registerNib:[UINib nibWithNibName:@"ZCDateSectionHeaderView" bundle:nil] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"ZCDateSectionHeaderView"];//注册组头
    }
    return _collectionView;
}
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView {
    
    return 15;
}

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
    
    return section % 2 == 0 ? 5 : 4;
}

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    
    ZCWeekCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:ZCWeekCollectionViewCell.reuseIdentifier forIndexPath:indexPath];

    return cell;
    
}

//单独设置每个item的大小
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath {

  return CGSizeMake(kScreenWidth / 4, 175);
}

//通过设置SupplementaryViewOfKind 来设置头部或者底部的view,其中 ReuseIdentifier 的值必须和 注册是填写的一致
- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath
{

    ZCDateSectionHeaderView *headerView = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"ZCDateSectionHeaderView" forIndexPath:indexPath];
    return headerView;
}

//单独设置每个header的大小
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section {
    if (section == 0) {
        return CGSizeMake(kScreenWidth, 115);
    }
    return CGSizeMake(kScreenWidth, 45);
}

//点击item方法
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
{
    NSLog(@"点击了 %ld %ld",indexPath.section,indexPath.item);
}

浮动的header

iOS9之后,UICollectionView的头部视图也能像tableView的header一样出现悬浮挂住的效果。

UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc] init]; 
//header 
flowLayout.sectionHeadersPinToVisibleBounds = YES; 
//footer
flowLayout.sectionFootersPinToVisibleBounds = YES;

iOS9之前需要自定义UICollectionViewFlowLayout
参考

浮动的header
上一篇下一篇

猜你喜欢

热点阅读