使用xib文件创建CollectionView

1.创建xib文件和CollectionViewController.h，.m文件

2.在View中拖入一个CollectionView，并在CollectionViewController.h中添加关联，并设置CollectionView的代理

3.将xib文件中CollectionView的File's Owner改为CollectionViewController

4.创建CollectionViewCell.h，.m文件和xib文件

5.在CollectionViewCell.xib中拖入一个ImageView和两个Label，并在CollectionViewCell.h中添加关联

添加如下代码

 

//CollectionView.h
#import <UIKit/UIKit.h>
@interface CollectionViewCell : UICollectionViewCell
@property (weak, nonatomic) IBOutlet UIImageView *goodsImg;
@property (weak, nonatomic) IBOutlet UILabel *goodsTitle;
@property (weak, nonatomic) IBOutlet UILabel *goodsDetail;
@end

 

 

//CollectionViewCell.m
#import "CollectionViewCell.h"

@implementation CollectionViewCell

- (void)awakeFromNib {
    [super awakeFromNib];
    // Initialization code
}

- (id)initWithFrame:(CGRect)frame {
    self = [super initWithFrame:frame];
    if (self) {
        [self setup];
    }
    return self;
}

- (void)setup {
    //加载xib文件
    [[NSBundle mainBundle] loadNibNamed:@"CollectionViewCell" owner:self options:nil];
}

@end

 

6.为CollectionView添加数据

 

//CollectionViewController.m
#import "CollectionViewController.h"
#import "CollectionViewCell.h"
#import "Good.h"

@interface CollectionViewController ()<UICollectionViewDelegate,UICollectionViewDataSource>

@property (weak, nonatomic) IBOutlet UICollectionView *collectionView;

@property (nonatomic, strong) NSMutableArray *goodsInfo;

@end

@implementation CollectionViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    self.collectionView.backgroundColor = [UIColor whiteColor];
    //注册cell，添加复用标识
    [self.collectionView registerClass:[CollectionViewCell class] forCellWithReuseIdentifier:@"identifier"];
    [self setData];
}

- (void) setData {
    self.goodsInfo = [[NSMutableArray alloc] init];
    
    Good *g1 = [[Good alloc] init];
    g1.title = @"自行车";
    g1.description = @"山地自行车";
    g1.image = @"ziXingChe";
    [self.goodsInfo addObject:g1];
    
    Good *g2 = [[Good alloc] init];
    g2.title = @"饮料";
    g2.description = @"汽水饮料";
    g2.image = @"yinLiao";
    [self.goodsInfo addObject:g2];
    
    Good *g3 = [[Good alloc] init];
    g3.title = @"柠檬";
    g3.description = @"新鲜柠檬";
    g3.image = @"ningMeng";
    [self.goodsInfo addObject:g3];
}

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

//返回CollectionView中cell的总数
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {
    return self.goodsInfo.count;
}

//设置cell的size,宽为屏幕宽的一半，两个cell间隔10个像素，高为200像素
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath {
    CGSize cellSize = CGSizeMake(([UIScreen mainScreen].bounds.size.width-10)/2, 200);
    return cellSize;
}

//添加数据
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {
    CollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"identifier" forIndexPath:indexPath];
    Good *good = [self.goodsInfo objectAtIndex:indexPath.row];
    cell.goodsTitle.text = good.title;
    cell.goodsTitle.text = good.description;
    cell.goodsImg.image  = [UIImage imageNamed:good.image];
    
    //垂直分割线
    CGSize contentSize = self.collectionView.contentSize;
    UIView *verticalLine = [[UIView alloc]initWithFrame:CGRectMake(contentSize.width * 0.5 - 0.5, 0, 1, contentSize.height - 8)];
    verticalLine.backgroundColor = [UIColor lightGrayColor];
    verticalLine.alpha = 0.35;
    [self.collectionView addSubview:verticalLine];
    
    //水平分割线
    UIView *horizontalLine = [[UIView alloc]initWithFrame:CGRectMake(0, (cell.frame.size.height + 10) * (indexPath.row + 1) , contentSize.width, 1)];
    horizontalLine.backgroundColor = [UIColor lightGrayColor];
    horizontalLine.alpha = 0.35;
    [self.collectionView addSubview:horizontalLine];
    
    return cell;
}

@end