sprout

导航

集合视图实例

//1.遵守相关协议

@interface ViewController : UIViewController<UICollectionViewDataSource,UICollectionViewDelegate,UICollectionViewDelegateFlowLayout>

// 2.创建布局方式对象

UICollectionViewFlowLayout * flowLayout = [[UICollectionViewFlowLayout alloc]init];

//2.1设置item的大小

flowLayout.itemSize = CGSizeMake(90,120);

//2.2设置每列的最小间距

flowLayout.minimumInteritemSpacing = 10;

//2.3设置每行最小的间距 

flowLayout.minimumLineSpacing = 20;

//2.4设置滚动方向(垂直)

flowLayout.scrollDirection = UICollectionViewScrollDirectionVertical;

//2.5设置header区域的大小

flowLayout.headerReferenceSize = CGSizMake(self.view.bounds.size.width, 30);

//2.6设置footer区域的大小

flowLayout.footerReferenceSize = CGSizeMake(self.view.bounds.sizee.width, 30);

//2.7设置item上左下右的间距

flowLayout.sectionInset = UIEdgeInsetsMake(10, 10, 5, 5);

//3.创建CollectionView(创建之前一定要有布局方式对象)

UICollectionView * collectionView = [UICollectionView alloc]initWithFrame:self.view.bounds collectionViewLayout:flowLayout];

//4.设置代理

collectionView.delegate = self;

collectionView.dataSource = self;

//5.注册cell的类型和重用标识,自定义一个cell

[collectionView registerClass:[MyCell class] forCellWithReuseIdentifier:@"cell"];

#pragma mark---------------注册header和footer

[collectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"header"];

[collectionView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:@"footer"];

//解析数据就不写了.

//遵守数据源里的协议

//设置有多少分区

- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView

{

    return 1;

}

//设置每个分区里有多少个item

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section

{

    return 100;   //这里可以是自己定义一个存放所有model对象  想当于   return _modeArray.count

}

//这个是必须实现的协议

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath

{

//重用标识

    MyCell * cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"cell" forIndexPath:indexPath];

// 获取数组中的一个model对象,通过indexPath

    Model * model = [_modelArray objectAtIndex:indexPath.row];

//异步方式加载图片(下面是自己的文件,图片)

    [cell.imageView sd_setImageWithURL:[NSURL URLWithString:model.thumbURL]placeholderImage:[UIImage imageNamed:@"nvshen.jpg"]];  

    return cell;

}

 

//header与footer也都是采用重用机制

//第二个参数kind,表示是你设置的是header还是footer

- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath

{

    if (kind == UICollectionElementKindSectionHeader) {

        //到重用集合中去取可用的header

        UICollectionReusableView * reusableView = [collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:@"header" forIndexPath:indexPath];

        //使用从重用集合中取出headerView

        reusableView.backgroundColor = [UIColor redColor];

    

        //返回值

        return reusableView;

    }else

    {

        UICollectionReusableView * reusableView = [collectionView dequeueReusableSupplementaryViewOfKind:kind withReuseIdentifier:@"footer" forIndexPath:indexPath];

        reusableView.backgroundColor = [UIColor whiteColor];

        return reusableView;

    }

}

 //设置item的大小

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionVIEWlayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath

{

       return CGSizeMake(90, 120);

}

//处理点击item的事件

- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath

{

//打印一下,点击item,触发事件

     NSLog(@"secton:%ld, row = %ld", indexPath.section, indexPath.row);

}

 

posted on 2015-02-05 19:54  sprout  阅读(101)  评论(0)    收藏  举报