UI18_UICollectionView

前言部分:
    UICollectionView是苹果官方提供的一种瀑布流效果.
    layout只负责布局样式,而不负责创建view。(view的创建是通过代理方法 datasource来实现的)
    Layout对象中定义了view的位置以及view大小size的信息

UICollectionView 的三要素介绍

(1)Cells:Layout就像一个管理者,而cell就是被管理者,每一个cell代
   表了collectionview中的一个item,一个collectionview可以放在一
   由Layout对象定义的。
(2)Supplementary Views:纯属显示的一个要素,不能被用户选择,而且
   还是可有可无的。只要你想为Section或者整个collection view 添加
   页眉和页脚,它就是了。
(3)Decoration Views:一个装饰品,不可被用户选择,类似于
   Supplementary View,使用和位置都是由Layout定义的。可有可无。

需要用到的数据:

    NSString *path = [[NSBundle mainBundle]pathForResource:@"Data" ofType:@"json"];
    NSData *data = [NSData dataWithContentsOfFile:path];
    NSArray *picArr = [NSJSONSerialization JSONObjectWithData:data options:0 error:nil];
    self.arr = [NSMutableArray array];
    //通过遍历picArr把里面的图片地址当到self.arr里
    for (NSDictionary *dic in picArr) 
    {
        //NSLog(@"%@",dic[@"thumbURL"]);
        [self.arr addObject:dic[@"thumbURL"]];
    }
**下面关于UICollectionViewFlowLayout设置**

1.创建对象

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

2.不同于tableView,它是用Item显示,所以需要先设置每个Item有多大

flowLayout.itemSize = CGSizeMake(80, 160);
 这个尺寸是自适应的

3.设置列间距

flowLayout.minimumInteritemSpacing =2;

4.设置行间距

flowLayout.minimumLineSpacing = 20;

5.设置滚动方向.默认是垂直方向

flowLayout.scrollDirection = UICollectionViewScrollDirectionHorizontal;

6.设置头或尾视图的尺寸

flowLayout.headerReferenceSize = CGSizeMake(0, 300);
**下面关于collectionView设置**

1.创建一个collectionView

UICollectionView *collectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height) collectionViewLayout:flowLayout];

2.签订协议履行协议内容

(1).签协议
    collectionView.dataSource = self;
    collectionView.delegate = self;
(2).实现协议
    - (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
    return self.arr.count;
}
**注意**
    **我们要注意与众不同的是cell的创建方式与tableView 的方式不同,我们在viewDidLoad中用注册的方式建立cell,如下:
    //第一个参数:需要制定注册对象的类型
    //第二个参数:重用标志
    [collectionView registerClass:[MyCell class] forCellWithReuseIdentifier:@"reuse"];
    //这个是cell之间的颜色
    collectionView.backgroundColor = [UIColor whiteColor];**

**使用注册的方式创建cell.必须使用自定义的cell.否则在里面会重复大量的创建视图,为了杜绝重复创建,必须使用自定义的cell**
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    //在collectionCell创建的时候,提供了另外一种不同于tableView的cell创建的方式
    //通过注册的方式,已经不用有重用标注  而且不用判断cell状况了   cell肯定不为空
    MyCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"reuse" forIndexPath:indexPath];
    //通过注册的方式创建的cell,在取值的时候就不需要在进行是否为空
    cell.contentView.backgroundColor = [UIColor yellowColor];
    cell.titleLabel.text = [NSString stringWithFormat:@"%ld",indexPath.row];
    //用sd让图片显示
    [cell.myImageView sd_setImageWithURL:[NSURL URLWithString:self.arr[indexPath.row]]];
    return cell;
}
在自定义的cell中的设置
**.h文件中**
@interface MyCell : UICollectionViewCell
@property (nonatomic, retain)UIImageView *myImageView;
@property (nonatomic, retain)UILabel *titleLabel;
@end
**.m文件中**
@implementation MyCell
- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        self.myImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 80, 100)];
        [self.contentView addSubview:self.myImageView];
        [_myImageView release];
        self.titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 100, 80, 30)];
        [self.contentView addSubview:self.titleLabel];
        [_titleLabel release];
    }
    return self;
}
- (void)dealloc
{
    [_myImageView release];
    [_titleLabel release];
    [super dealloc];
}
@end

定义头视图的代码

**1.在UICollectionViewFlowLayout创建对象下面给头视图预留空间**
flowLayout.itemSize = CGSizeMake(80, 160);
   **还有给尾视图留空间的**
      flowLayout.footerReferenceSize
**2.注册头视图**
第一个参数:需要注册的对象类型
第二个参数:指定的是头视图还是尾视图,常量字符串在系统的UICollectionVIewFlowLayout类的上面
第三个参数:重用标志
collectionView registerClass:[MyCollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"headerView"];
3.自定义头视图cell的.h@property (nonatomic, retain)UILabel *myLabel;
4.自定义头视图cell的.m中
- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        //创建子视图
        self.myLabel = [[UILabel alloc] init];
        self.myLabel.backgroundColor = [UIColor yellowColor];
        [self addSubview:self.myLabel];
        [_myLabel release];
    }
    return self;
}
- (void)layoutSubviews
{
    [super layoutSubviews];
    //在这设置子视图位置的大小
    self.myLabel.frame = CGRectMake(10, 10, 100, 30);
}
5.头视图显示cell的代码部分
- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath
{
    if ([kind isEqualToString:UICollectionElementKindSectionHeader]) {
        MyCollectionReusableView *view = [collectionView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"headerView" forIndexPath:indexPath];
        view.myLabel.text = @"111111";
        return view;
    }else
    {
        return nil;
    }
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值