UICollectionView-网格视图
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
> 注册标识单元格UICollectionViewCell, UICollectionView 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-网格视图的更多相关文章
- Android课程---关于GridView网格视图的学习
activity_ui6.xml <?xml version="1.0" encoding="utf-8"?> <GridView xmlns ...
- UICollectionView集合视图的概念
如何创建UICollectionView 集合视图的布局UICollectionViewFlowLayout 自定义cell 布局协议UICollectionViewDelegateFlowLayou ...
- Android学习笔记27:网格视图GridView的使用
网格视图GridView的排列方式与矩阵类似,当屏幕上有很多元素(文字.图片或其他元素)需要按矩阵格式进行显示时,就可以使用GridView控件来实现. 本文将以一个具体的实例来说明如何使用GridV ...
- Android开发10.3:UI组件GridView网格视图
GridView(网格视图) 概述 GridView用于在界面上按行.列分布的方式来显示多个组件 GridView和ListView有共同的父类 : AbsListView ...
- Android 网格视图GridView的使用
网格视图GridView的排列方式与矩阵类似,当屏幕上有很多元素(文字.图片或其他元素)需要按矩阵格式进行显示时,就可以使用GridView控件来实现. 本文将以一个具体的实例来说明如何使用GridV ...
- 网格视图GridView的使用
网格视图GridView的排列方式与矩阵类似,当屏幕上有很多元素(文字.图片或其他元素)需要按矩阵格式进行显示时,就可以使用GridView控件来实现. 本文将以一个具体的实例来说明如何使用GridV ...
- 【Android】10.3 网格视图(GridView)
分类:C#.Android.VS2015: 创建日期:2016-02-19 一.简介 网格视图(GridView)是在GridLayout的基础上添加了滚动功能的视图,即:GridView用于在可滚动 ...
- 用RecyclerView实现水平滚动和网格视图
建立RecyclerViewActivity.java文件 1 public class RecyclerViewActivity extends AppCompatActivity { 2 priv ...
- easyui数据网格视图(Datagrid View)的简单应用
下面介绍datagrid的数据网格详细视图和数据网格的分组视图 1.先引用的js和css文件 1)包含eauyui必备的四个文件easyui.css,icon.css, jquery-min.js.j ...
- UICollectionView 集合视图用法,自定义Cell
在View里面 //1.创建UICollectionViewFlowLayout UICollectionViewFlowLayout *flowLayout=[[UICollectionViewFl ...
随机推荐
- An operation on a socket could not be performed because the system lacked sufficient buffer space or because a queue was full.
与 SQL Server 建立连接时出现与网络相关的或特定于实例的错误.未找到或无法访问服务器.请验证实例名称是否正确并且 SQL Server 已配置为允许远程连接. (provider: TCP ...
- mysql 建立表之间关系 练习 2
创建数据库db6 create database db6 charset=utf8; user db6; # 创建班级表 mysql) not null unique); Query OK, rows ...
- C#简单实现动态数据生成Word文档并保存
今天正好有人问我,怎么生成一个报表式的Word文档. 就是文字的样式和位置相对固定不变,只是里面的内容从数据中读取. 我觉得类似这种的一般用第三方报表来做比较简便.但既然要求了Word,只好硬着头皮来 ...
- easymake cmake xmake nmake ...
最简单的Makefile,但是还是大程序少不了makefile工具 #CC=arm-linux-gnueabihf-CC=target: $(CC)gcc -o algo_main algo_m ...
- SQL基础二
一.SQL SELECT 语句 SELECT 语句用于从表中选取数据.结果被存储在一个结果表中(称为结果集). SQL SELECT 语法: SELECT 列名称 FROM 表名称 以及: SELEC ...
- Excel的单元格设置下拉选项并填充颜色
如何在Excel的单元格中加入下拉选项 方法/步骤 第一步:打开excel文档,选中需加入下拉选项的单元格. 第二步:点击菜单中的“数据”->“数据有效性”->“数据 ...
- python中json怎么转换成字典
json的标准格式:要求必须 只能使用双引号作为键 或者 值的边界符号,不能使用单引号,而且“键”必须使用边界符(双引号)
- PAT 天梯赛 L1-016. 查验身份证 【水】
题目链接 https://www.patest.cn/contests/gplt/L1-016 AC代码 #include <iostream> #include <cstdio&g ...
- 解决Can't connect to local MySQL server through socket '/tmp/mysql.sock'
0 Problem 电脑重启后用python的MySQLdb连接数据库报错 Can't connect to local MySQL server through socket '/tmp/mysql ...
- 做为 Apple Store App 独立开发者,你要搞限时促销,为你的应用生成激活码(或者优惠券),使用 Python 如何生成 200 个激活码(或者优惠券)?
import random import string def GenKey(length): chars = string.ascii_letters + string.digits return ...