ChildModel.h
#import <Foundation/Foundation.h> @interface ChildModel : NSObject @property (nonatomic, strong) NSString *imageString; @property (nonatomic, strong) NSString *nameString; - (instancetype)initWithDic:(NSDictionary *)dic; @end
ChildModel.m
#import "ChildModel.h" @implementation ChildModel - (instancetype)initWithDic:(NSDictionary *)dic { self = [super init]; if (self) { _imageString = dic[@"image"]; _nameString = dic[@"name"]; } return self; } @end
JFCell.h
#import <UIKit/UIKit.h> #import "ChildModel.h" @interface JFCell : UICollectionViewCell @property (nonatomic ,strong) UIImageView *cellImageView; @property (nonatomic ,strong) UILabel *cellLabel; - (void)updateJFCellWithObj:(ChildModel *)childObj; @end
JFCell.m
#import "JFCell.h" @implementation JFCell @synthesize cellImageView,cellLabel; - (instancetype)initWithFrame:(CGRect)frame { self = [super initWithFrame:frame]; if (self) { self.cellImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, frame.size.width, frame.size.height-20)]; self.cellImageView.backgroundColor = [UIColor brownColor]; [self addSubview:self.cellImageView]; self.cellLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, frame.size.height-20, frame.size.width, 20)]; self.cellLabel.backgroundColor = [UIColor lightGrayColor]; self.cellLabel.font = [UIFont systemFontOfSize:14]; self.cellLabel.textAlignment = NSTextAlignmentCenter; [self addSubview:self.cellLabel]; } return self; } - (void)updateJFCellWithObj:(ChildModel *)childObj { self.cellImageView.image = [UIImage imageNamed:childObj.imageString]; self.cellLabel.text = childObj.nameString; } @end
ViewController.m
#import "ViewController.h" #import "JFCell.h" //每行的cell个数 #define counts 3 //边距 #define margin 5 static NSString *cellString = @"cell"; @interface ViewController ()<UICollectionViewDataSource,UICollectionViewDelegate> { UICollectionView *JFCollectionView; NSMutableArray *childArray; } @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; childArray = [[NSMutableArray alloc] init]; //添加视图 [self addCollectionView]; //请求数据 [self requestData]; //-------------------①用户请求 } - (void)addCollectionView { CGFloat cellWidch = ([[UIScreen mainScreen] bounds].size.width-(counts+1)*margin)/counts; //专门负责布局的类 UICollectionViewFlowLayout *flowLayout = [[UICollectionViewFlowLayout alloc] init]; //滑动方向(纵向) flowLayout.scrollDirection = UICollectionViewScrollDirectionVertical; //元素的size flowLayout.itemSize = CGSizeMake(cellWidch, cellWidch+20); //元素的横向间距 flowLayout.minimumLineSpacing = margin; //元素的纵向间距 flowLayout.minimumInteritemSpacing = margin; //组距离 视图边上下左右的距离 flowLayout.sectionInset = UIEdgeInsetsMake(margin, margin, margin, margin); JFCollectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 0, [[UIScreen mainScreen] bounds].size.width, [[UIScreen mainScreen] bounds].size.height) collectionViewLayout:flowLayout]; JFCollectionView.backgroundColor = [UIColor whiteColor]; JFCollectionView.dataSource = self; JFCollectionView.delegate = self; //注册cell,重用 [JFCollectionView registerClass:[JFCell class] forCellWithReuseIdentifier:cellString]; [self.view addSubview:JFCollectionView]; } #pragma mark ----------------------UICollectionViewDataSource------------------- - (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section { return childArray.count; } - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath { JFCell *cell = [JFCollectionView dequeueReusableCellWithReuseIdentifier:cellString forIndexPath:indexPath]; //根据数据更新视图 [cell updateJFCellWithObj:childArray[indexPath.row]]; //------④更新视图,响应用户请求 return cell; } - (void)requestData { //构造虚拟数据(通常是从网络服务器获取到Json数据) NSArray *dataArray = @[ @{@"image":@"1.jpg",@"name":@"小美"}, @{@"image":@"2.jpg",@"name":@"小娜"}, @{@"image":@"4.jpg",@"name":@"小明"}, @{@"image":@"3.jpg",@"name":@"小娜"}, @{@"image":@"1.jpg",@"name":@"小美"}, @{@"image":@"5.jpg",@"name":@"小娜"}, @{@"image":@"6.jpg",@"name":@"小美"}, @{@"image":@"7.jpg",@"name":@"小娜"}, @{@"image":@"8.jpg",@"name":@"小苏"}, @{@"image":@"2.jpg",@"name":@"小娜"}, @{@"image":@"3.jpg",@"name":@"小娜"}, @{@"image":@"1.jpg",@"name":@"小娜"}, @{@"image":@"3.jpg",@"name":@"小娜"}, @{@"image":@"4.jpg",@"name":@"小娜"}, @{@"image":@"5.jpg",@"name":@"小娜"}, ]; for (NSDictionary *dic in dataArray) { ChildModel *model = [[ChildModel alloc] initWithDic:dic]; //----------②请求更新数据 [childArray addObject:model]; } //得到数据后更新视图 [JFCollectionView reloadData]; //------------③通知视图更新 } @end