1. UICollectionView

网格视图,除了提供与UITableView同样的功能显示一组顺序显示的数据,还支持多列的布局。

2. UICollectionView 使用

> 设置Controller要遵循的协议:

UICollectionViewDataSource               // 数据源协议

UICollectionViewDelegate                   // 数据行为协议

UICollectionViewDelegateFlowLayout   // 数据流式布局协议

> 创建流式布局

flowLayout = [[UICollectionViewFlowLayout alloc] init]

> 设置该布局下滑动方向

flowLayout.scrollDirection = UICollectionViewScrollDirectionVertical / Horizontal  // 默认是Vertical 在Horizontal时,元素是依次横向摆放,Vertical时,依次竖向摆放

> 以布局方式和frame 初始化UICollectionView

[[UICollectionView alloc] initWithFrame: collectionViewLayout: ]

> 设置背景色,纯代码实现时,UICollectionView默认背景色是黑色

.barckgroundColor

> 设置代理

.dataSource     // 代理 UICollectionViewDataSource

.delegate         // 代理 UICollectionViewDelegate ,UICollectionViewDelegateFlowLayout

> 注册标识单元格UICollectionViewCellUICollectionView Cell只能使用定制化的,并且必须注册。

[collectionView registerNib: forCellWithReuseIdentifier:]

[collectionView registerClass: forCellWithReuseIdentifier:]

> 注册标识分区表头/表尾 UICollectionReusableView,创建时要手动设置其class

[collectionView registerNib: forSupplementaryViewOfKind: withReuseIdentifier: ]

/* forSupplementaryViewOfKind: 表示是为表头还是表尾注册,参数只有两个可选值:UICollectionElementKindSectionHeader:表头,UICollectionElementKindSectionFooter: 表尾  */

> 协议方法

- UICollectionViewDataSource

必须实现:

// 每个分区条数(不是行数)

- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section;

// 数据绑定cell

- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath;

其他方法:

// 返回分区数量

- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView;

// 数据绑定表头/表尾:必须为其设置尺寸才可显示,注意查看不同scrollDirection下表头的展现

- (UICollectionReusableView *)collectionView:(UICollectionView *)collectionView viewForSupplementaryElementOfKind:(NSString *)kind atIndexPath:(NSIndexPath *)indexPath;

- UICollectionViewDelegateFlowLayout

// 返回分区表头尺寸

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout referenceSizeForHeaderInSection:(NSInteger)section;

// 返回分区表尾尺寸

- (CGSize)collectionView:(UICollectionView *)collectionView layout:

(UICollectionViewLayout*)collectionViewLayout referenceSizeForFooterInSection:(NSInteger)section;

// 返回每条的尺寸

- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath;

// 返回每个分区四周的外间距

- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section

// 返回每个分区内最小行间距

- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section

// 返回每个分区内条目之间最小内部距离

- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section

-UICollectionViewDelegate

// 条被选中:注意被选中的背景色,只能自定义selectedBackgroundView,且设置后,不能设置cell的背景色,否则无法看到点击选中效果

- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath;

// 条被反选

- (void)collectionView:(UICollectionView *)collectionView didDeselectItemAtIndexPath:(NSIndexPath *)indexPath;

UICollectionView-网格视图的更多相关文章

  1. Android课程---关于GridView网格视图的学习

    activity_ui6.xml <?xml version="1.0" encoding="utf-8"?> <GridView xmlns ...

  2. UICollectionView集合视图的概念

    如何创建UICollectionView 集合视图的布局UICollectionViewFlowLayout 自定义cell 布局协议UICollectionViewDelegateFlowLayou ...

  3. Android学习笔记27:网格视图GridView的使用

    网格视图GridView的排列方式与矩阵类似,当屏幕上有很多元素(文字.图片或其他元素)需要按矩阵格式进行显示时,就可以使用GridView控件来实现. 本文将以一个具体的实例来说明如何使用GridV ...

  4. Android开发10.3:UI组件GridView网格视图

    GridView(网格视图) 概述 GridView用于在界面上按行.列分布的方式来显示多个组件         GridView和ListView有共同的父类 : AbsListView       ...

  5. Android 网格视图GridView的使用

    网格视图GridView的排列方式与矩阵类似,当屏幕上有很多元素(文字.图片或其他元素)需要按矩阵格式进行显示时,就可以使用GridView控件来实现. 本文将以一个具体的实例来说明如何使用GridV ...

  6. 网格视图GridView的使用

    网格视图GridView的排列方式与矩阵类似,当屏幕上有很多元素(文字.图片或其他元素)需要按矩阵格式进行显示时,就可以使用GridView控件来实现. 本文将以一个具体的实例来说明如何使用GridV ...

  7. 【Android】10.3 网格视图(GridView)

    分类:C#.Android.VS2015: 创建日期:2016-02-19 一.简介 网格视图(GridView)是在GridLayout的基础上添加了滚动功能的视图,即:GridView用于在可滚动 ...

  8. 用RecyclerView实现水平滚动和网格视图

    建立RecyclerViewActivity.java文件 1 public class RecyclerViewActivity extends AppCompatActivity { 2 priv ...

  9. easyui数据网格视图(Datagrid View)的简单应用

    下面介绍datagrid的数据网格详细视图和数据网格的分组视图 1.先引用的js和css文件 1)包含eauyui必备的四个文件easyui.css,icon.css, jquery-min.js.j ...

  10. UICollectionView 集合视图用法,自定义Cell

    在View里面 //1.创建UICollectionViewFlowLayout UICollectionViewFlowLayout *flowLayout=[[UICollectionViewFl ...

随机推荐

  1. Jenkins+maven+Tomcat+SVN一键自动打包部署应用到服务器

    今天请教了大神,终于把jenkins给搞明白了 现在做下笔记,防止自己老年痴呆又忘了怎么配置 (截图可能不够清晰,有不清楚的随时评论打call) 机器配置: 安装配置规划 机器 192.168.169 ...

  2. Spark SQL原理和实现--王家林老师

  3. Visual Studio 2012的Windows Service服务安装方式

    windows服务应用程序是一种长期运行在操作系统后台的程序,它对于服务器环境特别适合,它没有用户界面,不会产生任何可视输出,任何用户输出都回被写进windows事件日志.计算机启动时,服务会自动开始 ...

  4. 【持续更新】ultraedit工具使用总结

    常用设置及快捷键 设置Ultraedit自动换行: 永久修改: 点击菜单栏的“高级→配置”,找到“编辑器→自动换行/制表符设置”,选择“默认为每个文件启用自动换行”,ok. 临时修改: 快捷键 Ctr ...

  5. display:inline-block; 去除间隙的方法 总结:

    个人常用: 如: <ul> <li><a href="#" >实时数据</a></li> <li><a ...

  6. xx-net***简明使用教程

    简介 继psiphon3.lantern.shadowsocks后,翻 土啬 界就来个新角色:xx-net 这张图是.2016.8.30日Google最新的搜索结果,还是可以看出这款工具的火爆程度的, ...

  7. 【学习ffmpeg】打开视频文件,帧分析,并bmp保存关键帧

    http://www.tuicool.com/articles/jiUzua   http://blog.csdn.net/code_future/article/details/8646717 主题 ...

  8. Python-GUI编程-PyQt5

    Python-GUI编程-PyQt5 1. GUI编程是什么? GUI 全称为: Graphical User Interface;简称GUI翻译为中文为: 图形化用户接口简单理解就是:- 使用Pyt ...

  9. tinyxml优化之一

    原文链接:http://www.cnblogs.com/zouzf/p/4154569.html 最近在搞XML解析优化,公司引擎用了tinyxml1和tinyxml2两个XML库,后者的效率比前者高 ...

  10. hadoop中mapreduce的默认设置

    MR任务默认配置: job.setMapperClass() Mapper Mapper将输入的<key,value>对原封不动地作为中间结果输出 job.setMapperOutputK ...