##DAY15——UICollectionView

2022-11-12,

DAY15——UICollectionView

创建UICollectionView

 //创建一个布局对象,采用系统布局类UICollectionViewFlowLayout
    UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init];

    //设置滑动方向
    layout.scrollDirection = UICollectionViewScrollDirectionVertical;

    CGFloat totalWidth = self.view.frame.size.width;

    //设置最小的行间距
    layout.minimumLineSpacing = ;

    //设置item与item之间的间距
    layout.minimumInteritemSpacing = ;

    //设置集合视图的分区间隔(上、左、下、右)
    layout.sectionInset = UIEdgeInsetsMake(, , , );

    //设置每一个item的尺寸的大小
    layout.itemSize = CGSizeMake((totalWidth - ) / , );

    //集合视图的创建必须指定布局,如果没有布局,显示不了任何东西
    UICollectionView *collectionView = [[UICollectionView alloc] initWithFrame:[[UIScreen mainScreen] bounds] collectionViewLayout:layout];

    //集合视图如果想要显示内容,必须将cell注册 MyCollectionViewCell
    [collectionView registerClass:[MyCollectionViewCell class] forCellWithReuseIdentifier:kReuse];

    //头部引用的尺寸
    layout.headerReferenceSize = CGSizeMake(, );

    //如果想要分区头视图显示,必须注册增广视图 MyCollectionReusableView
    [collectionView registerClass:[MyCollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"header"];

    //指定代理
    collectionView.dataSource = self;
    collectionView.delegate = self;

    [self.view addSubview:collectionView];

//返回增广视图,也就是头视图
collectionView:viewForSupplementaryElementOfKind:atIndexPath:
注意:
dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader

collectionView:cellForItemAtIndexPath:

#pragma mark -----UICollectionViewDelegateFlowLayout---------
collectionView:layout:sizeForItemAtIndexPath:
collectionView:layout:insetForSectionAtIndex:
collectionView:layout:minimumLineSpacingForSectionAtIndex:
collectionView:layout:minimumInteritemSpacingForSectionAtIndex:

自定义UICollectionViewLayout

#import "MyCollectionViewCell.h"

@implementation MyCollectionViewCell
- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        CGFloat totalWidth = frame.size.width;
        CGFloat totalHeight = frame.size.height;
        _imageView = [[UIImageView alloc] initWithFrame:CGRectMake(, , totalWidth, totalHeight - )];
        [self.contentView addSubview:_imageView];
        _showLabel = [[UILabel alloc] initWithFrame:CGRectMake(, totalHeight - , totalWidth, )];
        _showLabel.textAlignment = NSTextAlignmentCenter;
    }
    return self;
}
@end

#import "UIImageView+WebCache.h"
#import "Model.h"
#import "MyCollectionViewCell.h"
#import "UIImageView+WebCache.h"

@implementation ViewController

- (void)handleJSon{
    //获取json数据的路径
    NSString *filePath = [[NSBundle mainBundle] pathForResource:@"Data" ofType:@"json"];
    //获取NSData对象
    NSData *data = [NSData dataWithContentsOfFile:filePath];
    //解析json数据
    NSArray *arr = [NSJSONSerialization JSONObjectWithData:data options:NSJSONReadingMutableContainers error:nil];
    _dataArr = [[NSMutableArray alloc] initWithCapacity:];
    for (NSDictionary *dic in arr) {
        Model *model = [[Model alloc] init];
        [model setValuesForKeysWithDictionary:dic];
        [_dataArr addObject:model];
        [model release];
    }
}
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    MyCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"reuse" forIndexPath:indexPath];
    Model *model = _dataArr[indexPath .row];
    cell.showLabel.text = [NSString stringWithFormat:@"%ld, %ld",indexPath.section, indexPath.row];
    //获取链接
    NSURL *url = [NSURL URLWithString:model.thumbURL];
    //设置图片链接和占位图片
    [cell.imageView sd_setImageWithURL:url  placeholderImage:[UIImage imageNamed:@"placeHoderImage"]];
    return cell;
}
@end

##DAY15——UICollectionView的相关教程结束。

《##DAY15——UICollectionView.doc》

下载本文的Word格式文档,以方便收藏与打印。