实现效果如下。
1.往ViewController添加UICollectionView,并绑定Delegate和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); }
相关推荐
用UICollectionView集合视图布局iOS里面的表格。更适用初学UICollectionView控件的小介绍。
基于xcode6.4下写的一个集合视图的demo,适合新手学习。
UICollectionView-Demo 集合视图
2.框架更轻量级,因为取消了滑动相关,两个层级的UIview相比UICollectionView复杂的视图层级更轻便. 3.灵活的布局能力,可以方便的定义item的大小,delegate提供了一套自定义的布局方法。 GitHub : ...
UICollectionView和UICollectionViewController类是iOS6新引进的API,用于展示集合视图,布局更加灵活,可实现多列布局,用法类似于UITableView和UITableViewController类。使用UICollectionView必须实...
源码PSTCollectionView,PSTCollectionView是一款开源的表格集合视图,布局更加灵活,可实现多列布局,是用于iOS 4.3及其以上版本中的UICollectionView的100%开源API兼容替代品。如果想要使用UICollectionView,但...
1、在FlowLayout里面的prepareLayout方法中计算所有cell及“底部上拉加载更多视图”的frame 2、在layoutAttributesForElementsInRect中返回上一部我们计算好的frame的集合 3、在collectionViewContentSize中重新...
第一部分:Hello World!创建你的第一个iPhone App 第二部分:iOS编程基础:Hello World应用程序如何工作的?...第三十一部分:应用集合视图(UICollectionView) 第三十二部分:音乐、视频多媒体应用
滑行集合 UICollectionView Swift Controller的平滑,流畅,可自定义的决策 我们专门从事针对移动应用程序和网站的自定义UI的设计和编码。 请随时关注最新更新: 要求 iOS 8.0以上 Xcode 8 迅捷3(<= 1.0.3) ...
集合视图 演示如何构建 UICollectionView 的 iOS 项目。 在我的配套文章中阅读更多内容: :
集合视图类似于UICollectionView和UICollectionViewFlowLayout的网格布局的SwiftUI实现。 更新和后续文档。特征绑定到数据源和所选项目选择方式自定义列数自定义行高自定义间距基于块的点击和长按动作@ViewBuilder...
适用于 iOS 的轻量级收藏视图; 与 iOS 5 及以上版本兼容。 | 这到底是什么东西? TOGridView 是我正在开发的一个类,用于在我的商业 iOS 应用程序。 鉴于此类相对较大的规模和复杂性,再加上其在未来项目中潜在...
第四版包含如下内容(合计有700+页),增加比较多深入开发的内容: 第一部分:Hello World!创建你的第一个iPhone App ...第三十一部分:应用集合视图(UICollectionView) 第三十二部分:音乐、视频多媒体应用
UICollectionView的简单封装,横向分页滑动
集合视图简介 项目 - 在此存储库中可用。 您可以在适当的解决方案分支上找到解决方案。 自定义集合视图布局 - 此存储库中提供的解决方案 - 此存储库中提供的解决方案 布局过渡 项目 - 在这个 repo 中可用。 您可以...
库包含布局类和DRCollectionViewTableLayoutManager ,它充当代理,并允许配置集合视图,并以简单的方式将其与数据一起传播。 例如实施,签出附加的演示项目。 经过iOS 7测试,应该可以在iOS 6上使用(如果您打算...
第一部分:Hello World!创建你的第一个 iPhone App 第二部分:iOS 编程基础:Hello World 应用程序如何工作的? 第三部分:iOS 编程向导...第三十一部分:应用集合视图(UICollectionView) 第三十二部分:音乐、视频多媒体应用