UICollectionView布局功能
UIConllectionView和UITableView类似,也是展示数据,但不同于UITableView那种规则的布局,UICollectionView可以实现不规则的布局,即瀑布流。
创建UICollectionView
UICollectionView *collectionView = [[UICollectionView alloc] initWithFrame:[[UIScreen mainScreen] bounds] collectionViewLayout:layout];
集合视图的创建,必须要指定布局,如果没有布局,显示不了任何东西,即layout。
//创建一个布局对象,采用系统布局类UICollectinviewFlowLayout
UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init];
因为是系统的布局类,所以也是规则的,但可以自定义FlowLayout的,可以根据自己的需求,来创建不规则的网格。
可以对各个的布局细节分别进行设置
//设置最小的行间距
layout.minimumLineSpacing = ;
//设置item与item之间的间距
layout.minimumInteritemSpacing = ; //集合视图的分区间隔 //四个值 上左下右
layout.sectionInset = UIEdgeInsetsMake(, , , ); //设置集合视图的滑动方向
layout.scrollDirection = UICollectionViewScrollDirectionVertical;// 向下
layout.scrollDirection = UICollectionViewScrollDirectionHorizontal; // 向右
CGFloat totalWidth = self.view.frame.size.width;
//设置每一个item的尺寸大小
// layout.itemSize = CGSizeMake((totalWidth - 40) / 3, 80);
当然,签订协议之后也可以通过方法进行设置
说到协议 ,协议 分为两个部分,数据源协议UICollectionViewDelegateSource和代理协议UICollectionViewDelegate
因为涉及到布局,也会签订的布局协议UICollectionViewDelegateFlowLayout
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
return CGSizeMake((kWidth - ) / , );
}
- (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section{
return UIEdgeInsetsMake(, , , );
}
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section{
return ;
}
- (CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section{
return ;
}
UICollectionViewDataSource和UITableView一样,也有两个必须要实现的方法
//显示个数
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
return ;
}
//每个cell显示的内容
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
MyCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"reuse" forIndexPath:indexPath];
cell.contentView.backgroundColor = [UIColor colorWithRed:kColor green:kColor blue:kColor alpha:1.0];
cell.numberLabel.text = [NSString stringWithFormat:@"%ld",indexPath.row];
return cell;
}
我这边cell的显示内容是显示一个Label。自定义cell,来设置label的格式。
同UITableView一样,每个item都可以点击,触发 方法
//item点击之后触发的方法
- (void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{
NSLog(@"分区数%ld, 行数%ld",indexPath.section, indexPath.row);
}
值得注意的是,集合视图不像表视图那样,集合视图,如果想显示内容,就必须注册cell
//集合视图如果想要显示内容,就必须将cell进行注册
[collectionView registerClass:[MyCollectionViewCell class] forCellWithReuseIdentifier:@"reuse"];
注意:
集合视图的不规则布局在日常使用还是比较频繁的,因为每个空间布局都不一定会是规则,也会有差别,通过自定义FlowLayout..来显示不同的布局
UICollectionView布局功能的更多相关文章
- iOS 8自动调整UITableView和UICollectionView布局
本文转载自:http://tech.techweb.com.cn/thread-635784-1-1.html 本文讲述了UITableView.UICollectionView实现 self-siz ...
- [转]iOS8 自动调整UITableView和UICollectionView布局
转自:http://www.cocoachina.com/industry/20140825/9450.html (via:玉令天下的Blog) 本文讲述了UITableView.UICollec ...
- 利用修改div的位置+js对象存储div信息 实现简单的div自定义布局功能
原文:利用修改div的位置+js对象存储div信息 实现简单的div自定义布局功能 利用修改div的位置+js对象存储div信息 实现简单的div自定义布局功能1.在界面上添加几个checkbox和一 ...
- ABBYY FineReader 15新增编辑页面布局功能
ABBYY FineReader 15(Windows系统) 新增编辑页面布局功能,允许用户修改PDF数字文档的页面布局,包括添加或者删除文字段落,文字块以及图片,更改段落,文字块,图片位置.添加或者 ...
- UICollectionView布局cell的三种方式
UICollectionViewFlowLayout里面: // 方法一 - (void)prepareLayout{} // 方法二 - (nullable NSArray<__kindof ...
- iOS开发之窥探UICollectionViewController(三) --使用UICollectionView自定义瀑布流
上篇博客的实例是自带的UICollectionViewDelegateFlowLayout布局基础上来做的Demo, 详情请看<iOS开发之窥探UICollectionViewControlle ...
- iOS下的界面布局利器-MyLayout布局框架
Swift:TangramKit: https://github.com/youngsoft/TangramKit OC:MyLayout: https://github.com/youngsof ...
- iOS UICollectionView(转三)
上篇博客的实例是自带的UICollectionViewDelegateFlowLayout布局基础上来做的Demo, 详情请看<iOS开发之窥探UICollectionViewControlle ...
- iOS电商常见动画与布局、微信悬浮窗、音乐播放器、歌词解析、拖动视图等源码
iOS精选源码 MXScroll 介绍 混合使用UIScrollView ios 电商demo(实现各种常见动画效果和页面布局) 一行代码集成微信悬浮窗 可拖动,大小的视图,可放置在屏幕边缘. 在使用 ...
随机推荐
- 寻找研究基于NS2研究覆盖网络的小伙伴:)
如题,本人菜鸟刚刚入门,想找些基于NS2研究覆盖网络方面的小伙伴,具体点是关于覆盖网络中QoS服务调度方法方面的,有的小伙伴可以留下联系方式,或者加我QQ:245939069 :P:P:P
- filter_input() 函数
定义和用法 filter_input() 函数从脚本外部获取输入,并进行过滤. 本函数用于对来自非安全来源的变量进行验证,比如用户的输入. 本函数可从各种来源获取输入: INPUT_GET INPUT ...
- asp.net 页面的Meta元素
<meta charset="utf-8" /> <meta name="viewport" content="initial ...
- 2015GitWebRTC编译实录11
2015.07.21 ilbc 编译通过注意有几个win32打头的文件,其实都是要编进去的[429/1600 ] CC obj ilbc.abs_quant.o[430/1600 ] CXX obj ...
- bootstrap-7
基础表单: 表单中常见的元素主要有:文本输入框.下拉选择框.单选按钮.复选按钮.文本框和按钮等. bootstrap并未对齐做太多的的定制化效果设计,仅仅对表单内的fieldset.legend.la ...
- linux iftop流量查看工具的安装与使用
1.安装依赖包yum install flex byacc libpcap ncurses ncurses-devel libpcap-devel 2.下载iftop wget http://www ...
- Xerces链接错误原因之/Zc:wchar_t-设置不一致
今天程序需要使用Xerces作为xml文件的解析与序列化工具,使用的是Xerces2.7.0版本.具体编译教程如下: 成功编译出了Xerces.dll和Xerces.lib.但是在链接到主工程的时候, ...
- [原创]cocos2d-x研习录-第二阶 概念类之节点类(CCNode)
节点类CCNode在基本概念中并不存在,它是为了建立基本概念之间的关联关系而抽象出来的中间辅助类.这个类在Cocos2D-x中极为重要,它为概念类之间搭建了一座宏伟的桥梁.它的继承关系图如下: ...
- python基础教程之抽象
很早知道python,但没有坚持学习.最近心血来潮,但能弥补这个遗憾. 对象几个重要概念: 多态:可以对不同类的对象使用同样的操作: 封装:对外部世界隐藏对象的工作细节: 继承:以普通的类为基础建立专 ...
- The error occurred while setting parameters--索引 3 超出范围 sqlserver2008
这个问题不是jar包冲突,是表的问题,表里的ID设置成自动增加1,就可以了!