UICollectionViewCell

来源：互联网发布：神仙劫仙羽进阶数据编辑：程序博客网时间：2024/05/22 14:21

重点分析:
1. 从xib中加载cell,创建nib文件注册cell设置标识符,在创建cell中加入标识符,在xib右侧窗口添加标识符与上面一致.
2. 设置CollectionViewCell时,必须设置layout.
3. 设置CollectionViewCell中图片圆角 self.productImage.layer.cornerRadius = 10;
self.productImage.clipsToBounds = YES;

一.数据模型(M)

功能分析: 配置数据模型,将解析的数据传入数据模型中.

#import <Foundation/Foundation.h>@interface ProductsModel : NSObject/**标题*/@property (copy, nonatomic) NSString *title;/**ID*/@property (copy, nonatomic) NSString *ID;/**网址*/@property (copy, nonatomic) NSString *url;/**图片*/@property (copy, nonatomic) NSString *icon;/**自定义网址*/@property (copy, nonatomic) NSString *customUrl;- (instancetype)initWithDictionary:(NSDictionary *)dic;+ (instancetype)productModelWithDictionary:(NSDictionary *)dic;@end/**实现方法*/#import "ProductsModel.h"@implementation ProductsModel+ (instancetype)productModelWithDictionary:(NSDictionary *)dic{    return [[self alloc] initWithDictionary:dic];}- (instancetype)initWithDictionary:(NSDictionary *)dic{    if (self = [super init]){        [self setValuesForKeysWithDictionary:dic];        self.ID = dic[@"id"];    }    return self;}/**当找不到的话,不会崩*/- (void)setValue:(id)value forUndefinedKey:(NSString *)key{  }@end

二. 控制器(C)

功能分析: 当设置UICollectionViewCell必须设置 UICollectionViewFlowLayout(流水布局),

#import "ProductCollection.h"#import "ProductsModel.h"#import "ProductCell.h"@interface ProductCollection ()@property (strong, nonatomic) NSArray *collectionArray;@end@implementation ProductCollection/**创建标识符*/static NSString * const reuseIdentifier = @"products";- (NSArray *)collectionArray{    if (_collectionArray == nil){        /**1.读取json文件*/        NSString *path = [[NSBundle mainBundle] pathForResource:@"products.json" ofType:nil];        /**2.转换成data*/        NSData *data = [NSData dataWithContentsOfFile:path];        /**3.换json格式文件解析成数组*/        NSArray *array  = [NSJSONSerialization JSONObjectWithData:data options:NSJSONReadingMutableContainers error:nil];        /**4.创建数据模型*/        NSMutableArray *dataArray = [NSMutableArray array];        for (NSDictionary *dic in array) {            ProductsModel *products = [ProductsModel productModelWithDictionary:dic];            [dataArray addObject:products];        }        _collectionArray = dataArray;    }    return _collectionArray;}#pragma mark--重写init方法,添加layout,因为CollectionView必须设置layout- (instancetype)init{    /**1.流水布局*/    UICollectionViewFlowLayout *layouts = [[UICollectionViewFlowLayout alloc] init];    /**2.每个cell的尺寸*/    layouts.itemSize = CGSizeMake(80, 80);    /**3.设置cell之间的水平间距*/    layouts.minimumInteritemSpacing = 2;    /**4.设置cell之间的垂直间距*/    layouts.minimumLineSpacing = 10;    /**5.设置四周间距*/    layouts.sectionInset = UIEdgeInsetsMake(layouts.minimumLineSpacing, 5, 0, 5);    return [super  initWithCollectionViewLayout:layouts];}- (void)viewDidLoad {    [super viewDidLoad];    /**设置背景颜色*/    self.collectionView.backgroundColor = [UIColor whiteColor];    /**注册cell标识符*/    UINib *nib = [UINib nibWithNibName:@"ProductCell" bundle:nil];    [self.collectionView registerNib:nib forCellWithReuseIdentifier:reuseIdentifier];}#pragma mark <UICollectionViewDataSource>- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section {   return  self.collectionArray.count;}- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath {    ProductCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:reuseIdentifier forIndexPath:indexPath];    cell.products = self.collectionArray[indexPath.item];    return cell;}@end

三. UICollectionViewCell视图(V)

#import <UIKit/UIKit.h>@class ProductsModel;@interface ProductCell : UICollectionViewCell/**配置数据模型*/@property (strong, nonatomic) ProductsModel *products;@end#import "ProductCell.h"#import "ProductsModel.h"@interface ProductCell()/**图片*/@property (weak, nonatomic) IBOutlet UIImageView *productImage;/**标题*/@property (weak, nonatomic) IBOutlet UILabel *ProductTitle;@end@implementation ProductCell- (void)awakeFromNib {    // Initialization code    /**设置圆角*/    self.productImage.layer.cornerRadius = 10;    self.productImage.clipsToBounds = YES;}#pragma mark--设置模型- (void)setProducts:(ProductsModel *)products{    _products = products;    self.productImage.image = [UIImage imageNamed:products.icon];    self.ProductTitle.text = products.title;}@end

0 0