IOS之集合视图UICollectionView

? ? ? ? 实现效果如下。

?

1.往ViewController添加UICollectionView，并绑—elegate和DataSource。

2.新建单元类BookCell，继承UICollectionViewCell

?

BookCell.h

?

#import <UIKit/UIKit.h>@interface BookCell : UICollectionViewCell@property (weak, nonatomic) IBOutlet UIImageView *imageView;//自定义单元控件1@property (weak, nonatomic) IBOutlet UILabel *label;//自定义单元控件2@end

?BookCell.m

#import "BookCell.h"@implementation BookCell- (id)initWithFrame:(CGRect)frame{    self = [super initWithFrame:frame];    if (self) {        // Initialization code    }    return self;}@end

?3.在Interface Builder中设置UICollectionView的Cell的class为BookCell.选中设计界面的单元格，（1）把连线连接到左边View Controller Scene的UICollectionView的Cell的UIImageView，在弹出的菜当中选择imageView（即对应BookCell的imageView变量）（2）把连线连接到左边View Controller Scene的UICollectionView的Cell的UILabel，在弹出的菜当中选择label（即对应BookCell的label变量）(3)选中UICollectionView的Cell，将identifier设置为bookCell（下面第5步会有说明）

?4.设置UICollectionView的数据源初始化。user_head.plist以及图片请见附件。

- (void)viewDidLoad{    [super viewDidLoad];// Do any additional setup after loading the view.    [self initCollectionView];}-(void)initCollectionView{    NSBundle *bundle = [NSBundle mainBundle];    NSString *plistPath = [bundle pathForResource:@"user_head" ofType:@"plist"];    dataArr = [[NSArray alloc] initWithContentsOfFile:plistPath];//dataArr为.h文件定义的变量    NSLog(@"data count = %d",[dataArr count]);}

?5.将数据源绑定到UICollectionView

?

//显示多少行- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{    return 3;}//显示多少列- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{    return 2;}//为每个单元设置UI- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{    BookCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"bookCell" forIndexPath:indexPath];//"bookCell" 对应第三步的cell的identifier    NSDictionary *dict = [dataArr objectAtIndex:(indexPath.section*2+indexPath.row)];//2为每行的个数    cell.label.text = [dict objectForKey:@"itemName"];    NSLog(@"itemName= %@",[dict objectForKey:@"itemName"]);    cell.imageView.image = [UIImage imageNamed:[dict objectForKey:@"itemImagePath"]];    return cell;}

?

?6.添加选择单元格之后的触发事件。

//选择单元格触发事件- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{    NSDictionary *dict = [dataArr objectAtIndex:(indexPath.section*2+indexPath.row)];//2为每行的个数    NSString *userName = [dict objectForKey:@"itemName"];    NSString *userHead = [dict objectForKey:@"itemImagePath"];    NSLog(@"userName = %@, userHead = %@", userName,userHead);}

?