UICollectionView和自定义UICollectionViewCell的基本用法

下面简单介绍一下UICollectionView的基本用法：

直接上代码：

STPlayHistoryViewController.m

//
//  STPlayHistoryViewController.m

#import "STPlayHistoryViewController.h"
#import "STPlayHistoryViewCell.h"

@interface STPlayHistoryViewController () <UICollectionViewDelegate,UICollectionViewDataSource>

@property (nonatomic, strong) UICollectionView *playHistoryView;

@end

@implementation STPlayHistoryViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    self.view.backgroundColor = [UIColor whiteColor];
    self.bar.title = @"播放历史";

    [self.view addSubview:self.playHistoryView];

}

- (BOOL)customNavigationBar {
    return YES;
}



#pragma mark - Style
- (UICollectionView *)playHistoryView {
    if (!_playHistoryView) {
        UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init]; //自动网格布局/自动流式布局
        //layout.scrollDirection = UICollectionViewScrollDirectionVertical; //滚动方向设为垂直滚动
        //layout.minimumLineSpacing = 0;   //行间距
        //layout.minimumInteritemSpacing = 0;  //列间距

        //layout.sectionInset = UIEdgeInsetsMake(10, 10, 10, 10);    //item边距

        _playHistoryView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, self.bar.bottom, __widthScreen, __heightScreen-64) collectionViewLayout:layout];  //collectionView的尺寸
        _playHistoryView.backgroundColor = [UIColor whiteColor];
        _playHistoryView.showsVerticalScrollIndicator = NO;  //隐藏滚动条
        //注册自定义collectionCell
        [_playHistoryView registerClass:[STPlayHistoryViewCell class] forCellWithReuseIdentifier:[STPlayHistoryViewCell cellIdentifier]];

        [_playHistoryView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"headView"];         //注册头视图

        [_playHistoryView registerClass:[UICollectionReusableView class] forSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:@"footView"];    //注册尾视图

        _playHistoryView.delegate = self;
        _playHistoryView.dataSource = self;

    }
    return _playHistoryView;
}


#pragma mark - UICollectionViewDataSource
//每个section有几个item
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
    return 2;
}

//collectionView有几个section
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView {
    return 10;
}

//每个cell的具体内容
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:( NSIndexPath *)indexPath {


    STPlayHistoryViewCell *cell = [self.playHistoryView dequeueReusableCellWithReuseIdentifier:[STPlayHistoryViewCell cellIdentifier] forIndexPath:indexPath];

    //给自定义cell的model传值 （从接口获取的网络数据）
    cell.historyModel = self.historyArray[indexPath.section][indexPath.item];

    return cell;
}

//头尾视图
- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath {

    if ([kind isEqualToString:UICollectionElementKindSectionHeader]) {
        //头视图
        UICollectionReusableView *headView = [_playHistoryView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionHeader withReuseIdentifier:@"headView" forIndexPath:indexPath];


        /*头视图里的UI内容*/

        return headView;

    }else {
        //尾视图
        UICollectionReusableView *footView = [_playHistoryView dequeueReusableSupplementaryViewOfKind:UICollectionElementKindSectionFooter withReuseIdentifier:@"footView" forIndexPath:indexPath];
        for (UIView *view in footView.subviews) {
            [view removeFromSuperview];
        }

        /*尾视图里的UI内容*/

        return footView;
    }
}

#pragma mark - UICollectionViewDelegate
//头视图尺寸
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(nonnull UICollectionViewLayout *)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section {

    return CGSizeMake(__widthScreen, 35);

}
//尾视图尺寸
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(nonnull UICollectionViewLayout *)collectionViewLayout referenceSizeForFooterInSection:(NSInteger)section {

    if (section == self.historyArray.count - 1) {
        return CGSizeZero;
    }
    return CGSizeMake(__widthScreen, 10);

}

//cell size
- (CGSize)collectionView:(UICollectionView *)collectionView
                  layout:(UICollectionViewLayout *)collectionViewLayout
  sizeForItemAtIndexPath:(NSIndexPath *)indexPath{

    return CGSizeMake(__widthScreen, [STPlayHistoryViewCell heightForItemCell]);

}

//item边距
-(UIEdgeInsets)collectionView:(UICollectionView *)collectionView
                       layout:(UICollectionViewLayout *)collectionViewLayout
       insetForSectionAtIndex:(NSInteger)section {
    if (self.appArray.count > 1) {
        return UIEdgeInsetsMake(0, 12.0, 0, 12.0);
    }else {
        return UIEdgeInsetsMake(0, 0.0, 0, 0.0);
    }
}

//行间距
- (CGFloat)collectionView:(UICollectionView *)collectionView
                   layout:(UICollectionViewLayout*)collectionViewLayout
minimumLineSpacingForSectionAtIndex:(NSInteger)section {
    if (self.appArray.count > 1) {
        return 10.0;
    }else {
        return 0.0;
    }
}

//点击某个cell
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{

}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end

以上就是UICollectionView的基本使用；

下面再简单介绍一下UICollectionView的自定义cell的基本用法：

STPlayHistoryViewCell.h
直接上代码：

#import "STBaseCollectionCell.h"
#import "STPlayHistoryModel.h"
@interface STPlayHistoryViewCell : STBaseCollectionCell

@property (nonatomic, strong) STPlayHistoryModel *historyModel;

@end

STPlayHistoryViewCell.m

//
//  STPlayHistoryViewCell.m

#import "STPlayHistoryViewCell.h"
#import "UILabel+LineWidth.h"

@interface STPlayHistoryViewCell ()
@property (nonatomic, strong) UIImageView *sortImageView;
@property (nonatomic, strong) UIImageView *shadeImageView;
@property (nonatomic, strong) UILabel *sortLabel;
@property (nonatomic, strong) UILabel *nameLabel;
@property (nonatomic, strong) UILabel *titleLabel;
@property (nonatomic, strong) UILabel *playCountLabel;
@property (nonatomic, strong) UIView *bottomLine;
@end

@implementation STPlayHistoryViewCell

- (instancetype)initWithFrame:(CGRect)frame {
    if (self = [super initWithFrame:frame]) {

        _shadeImageView = [UIImageView new];
        _shadeImageView.layer.masksToBounds = YES;
        _shadeImageView.layer.cornerRadius = 3;
        _shadeImageView.image = [UIImage imageNamed:@"pic"];
        [self.contentView addSubview:_shadeImageView];
        [_shadeImageView mas_makeConstraints:^(MASConstraintMaker *make) {
            make.left.mas_equalTo(self.contentView).mas_offset(_changeWidth(10));
            make.centerY.mas_equalTo(self.contentView);
            make.width.mas_equalTo(_changeWidth(153));
            make.height.mas_equalTo(_changeWidth(153)*(172.f/306.f));
        }];

        //标题
        _titleLabel = [UILabel new];
        [_titleLabel setFont:[UIFont fontWithName:@"Helvetica-Bold" size:14]];
        _titleLabel.textColor = __ColorHex(0x272b3c);
        _titleLabel.numberOfLines =2;
        _titleLabel.lineBreakMode = NSLineBreakByTruncatingTail;
        _titleLabel.text = @"夏天到来，想要沁心凉一下吗这个夏天都不会热哦";
        [UILabel changeSpaceForLabel:_titleLabel withLineSpace:5.0 WordSpace:0.01];
        [self addSubview:_titleLabel];
        [_titleLabel mas_makeConstraints:^(MASConstraintMaker *make) {
            make.top.mas_equalTo(self).offset(_changeHeight(30));
            make.left.mas_equalTo(self.shadeImageView.mas_right).offset(_changeWidth(10));
            make.right.mas_equalTo(-15);
        }];

        //头像
        _sortImageView = [UIImageView new];
        _sortImageView.layer.masksToBounds = YES;
        _sortImageView.layer.cornerRadius = 10;
        _sortImageView.image = [UIImage imageNamed:@"headicon.jpg"];
        [self addSubview:_sortImageView];
        [_sortImageView mas_makeConstraints:^(MASConstraintMaker *make) {
            make.left.mas_equalTo(_titleLabel.mas_left);
            make.top.mas_equalTo(_titleLabel.mas_bottom).offset(_changeHeight(10));
            make.width.height.mas_equalTo(20);
        }];
        //名字
        _nameLabel = [UILabel new];
        _nameLabel.textColor = [UIColor blackColor];
        _nameLabel.font = [UIFont systemFontOfSize:12];
        _nameLabel.textAlignment = NSTextAlignmentCenter;
        _nameLabel.text = @"蛋糕店吴老师";
        _nameLabel.textColor = __ColorHex(0x9b9fad);
        [self addSubview:_nameLabel];
        [_nameLabel mas_makeConstraints:^(MASConstraintMaker *make) {
            make.centerY.mas_equalTo(self.sortImageView);
            make.left.mas_equalTo(self.sortImageView.mas_right).offset(_changeWidth(5));
        }];
        //学习人数
        _playCountLabel = [UILabel new];
        [self.contentView addSubview:_playCountLabel];
        [_playCountLabel mas_makeConstraints:^(MASConstraintMaker *make) {
            make.centerY.mas_equalTo(_sortImageView);
            make.right.mas_equalTo(self.contentView).offset(-10.0);
        }];

        self.bottomLine = [[UIView alloc]init];
        self.bottomLine.backgroundColor = __ColorHex(0xf6f6f6);
        [self addSubview:self.bottomLine];
        [self.bottomLine mas_makeConstraints:^(MASConstraintMaker *make) {
            make.height.mas_equalTo(1);
            make.bottom.mas_equalTo(self.mas_bottom).mas_equalTo(1);
            make.left.mas_equalTo(10);
            make.right.mas_equalTo(-10);
        }];
    }
    return self;
}

//网络数据赋值
- (void)setHistoryModel:(STPlayHistoryModel *)historyModel {
    _historyModel = historyModel;
    [self.shadeImageView sd_setImageWithURL:[NSURL URLWithString:historyModel.img_url]];
    self.titleLabel.text = historyModel.des;
    [self.sortImageView sd_setImageWithURL:[NSURL URLWithString:historyModel.head]];
    self.nameLabel.text = historyModel.nick;

    NSString *count = [STCommonDefine stringForCount:[historyModel.study_count longLongValue]];
    NSString *studyCount = [NSString stringWithFormat:@"%@人学习",count];
    _playCountLabel.attributedText = [NSMutableAttributedString attributeString:studyCount font:[UIFont systemFontOfSize:12] range:NSMakeRange(0, historyModel.study_count.length)colorHighlight:__ColorHex(0x9b9fad) commonColor:__ColorHex(0xc6c9d2)];

}

+ (CGFloat)heightForItemCell {
    CGFloat _scale = 252.f/2/375.f;
    return __widthScreen*_scale;
}

@end