ios 集合視圖(九宮格佈局)

利用UIViewController,UIView,UICollectionViewCell,通過重寫UICollectionViewDelegate,UICollectionViewDelegateFlowLayout, 協議的一些方法實現(以及UICollectionViewDataSource)

1,在RootViewController裏面

    //設置代理
    self.rtView.coll.dataSource = self;
    self.rtView.coll.delegate = self;
    //註冊cell
    [self.rtView.coll registerClass:[myCell class] forCellWithReuseIdentifier:kCollCell];
    //在設置header時要用到
    //註冊header
    [self.rtView.coll registerClass:[UICollectionReusableView class] 
       forSupplementaryViewOfKind:UICollectionElementKindSectionHeader 
       withReuseIdentifier:kHeaderView];
    //註冊footer
    [self.rtView.coll registerClass:[UICollectionReusableView class] 
       forSupplementaryViewOfKind:UICollectionElementKindSectionFooter 
       withReuseIdentifier:kFooterView];

//返回cell
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView 
cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    myCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:kCollCell 
        forIndexPath:indexPath];
    cell.backgroundColor = [UIColor colorWithRed:kColorChange green:kColorChange 
        blue:kColorChange alpha:1];
    return cell;
}

//設置header和footer
-(UICollectionReusableView *)collectionView:(UICollectionView *)collectionView 
     viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)
     indexPath
{
    if (kind == UICollectionElementKindSectionHeader) {
        UICollectionReusableView *header = [collectionView dequeueReusableSupplementaryViewOfKind:
             UICollectionElementKindSectionHeader withReuseIdentifier:kHeaderView 
             forIndexPath:indexPath];
        header.backgroundColor = [UIColor yellowColor];
        UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 100, 
             header.bounds.size.height)];
        label.text = @"哈哈";
        [header addSubview:label];
        return header;
    }else{
        UICollectionReusableView *footer = [collectionView dequeueReusableSupplementaryViewOfKind:
            UICollectionElementKindSectionFooter withReuseIdentifier:kFooterView 
            forIndexPath:indexPath];
        return footer;
    }
    
}

2,在RootView裏面

 

//視圖佈局
-(void)addAllViews
{
    //1,創建UICollectionViewFlowLayout
    //對cell進行佈局控制
    UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc] init];
    //設置
    //1.1,設置大小
    flowLayout.itemSize = CGSizeMake(80, 100);
    //1.2,設置間距(如果給定的間距,無法滿足屏幕寬度,設置無效)
    flowLayout.minimumInteritemSpacing = 10;
    //1.3,設置行間距
    flowLayout.minimumLineSpacing = 10;
    //1.4,設置滑動方向
    flowLayout.scrollDirection = UICollectionViewScrollDirectionVertical;
    //1.5,heater
    flowLayout.headerReferenceSize = CGSizeMake(self.bounds.size.width, 30);
    //1.6,footer
    flowLayout.footerReferenceSize = CGSizeMake(self.bounds.size.width, 100);
    //1.7,設置字內邊框
    flowLayout.sectionInset = UIEdgeInsetsMake(10, 10, 10, 10);
    //2,創建集合視圖
    self.coll = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen 
     mainScreen].bounds.size.width, CGRectGetHeight(self.frame)) collectionViewLayout:
     flowLayout];
    self.coll.backgroundColor = [UIColor whiteColor];
    [self addSubview:self.coll];
}

3,MyCell裏面(繼承於UICollectionViewCell)

//視圖佈局
-(void)addAllViews
{
    //視圖空間加載在contentView上
    self.imV = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 
        self.contentView.bounds.size.width, self.contentView.bounds.size.height-20)];
    self.imV.backgroundColor = [UIColor redColor];
    [self.contentView addSubview:self.imV];
    
    self.myLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, CGRectGetMaxY(self.imV.frame), 
        self.contentView.bounds.size.width, self.contentView.bounds.size.height - 
        CGRectGetHeight(self.imV.frame))];
    self.myLabel.text = @"nice";
    self.myLabel.textAlignment = NSTextAlignmentCenter;
    [self.contentView addSubview:self.myLabel];
}
//一旦改變,重新顯示
-(void)layoutSubviews
{
    [super layoutSubviews];
    self.imV.frame = CGRectMake(0, 0, self.contentView.bounds.size.width, 
          self.contentView.bounds.size.height-20);
    self.myLabel.frame = CGRectMake(0, CGRectGetMaxY(self.imV.frame), 
          self.contentView.bounds.size.width, self.contentView.bounds.size.height - 
          CGRectGetHeight(self.imV.frame));
}