文档章节

iOS开发--UICollectionView的使用

c
 chaoGod
发布于 2015/02/28 19:10
字数 566
阅读 100
收藏 0

UICollectionView 和 UICollectionViewController 类,用于展示集合视图,布局更加灵活,可实现多列布局,用法类似于UITableView 和 UITableViewController 类

使用UICollectionView 必须实现UICollectionViewDataSource,UICollectionViewDelegate,UICollectionViewDelegateFlowLayout这三个协议。


先给出一些常用的方法

//定义UICollectionViewCell的个数  
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section  
{  
    return 30;  
}   
//定义展示的Section(组)的个数  
-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView  
{  
    return 1;  
}   
//每个UICollectionView展示的内容  
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath  
{  
    static NSString * CellIdentifier = @"GradientCell";  
    UICollectionViewCell * cell = [collectionView dequeueReusableCellWithReuseIdentifier:CellIdentifier forIndexPath:indexPath];  
  
     return cell;  
} 
  
#pragma mark --UICollectionViewDelegateFlowLayout   
//定义每个UICollectionView 的大小  
- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath  
{  
    return CGSizeMake(80, 100);  
}
   
//定义每个UICollectionView 的 margin ,上下左右的间隔 
-(UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section  
{  
    return UIEdgeInsetsMake(5, 5, 5, 5);  
} 
  
#pragma mark --UICollectionViewDelegate   
//UICollectionView被选中时调用的方法  
-(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath  
{  
    UICollectionViewCell * cell = (UICollectionViewCell *)[collectionView cellForItemAtIndexPath:indexPath];  
    cell.backgroundColor = [UIColor whiteColor];  
}
   
//返回这个UICollectionView是否可以被选择  
-(BOOL)collectionView:(UICollectionView *)collectionView shouldSelectItemAtIndexPath:(NSIndexPath *)indexPath  
{  
    return YES;  
}


下面用一个简单的例子介绍一下

在viewcontroller中添加一个uicollectionview

首先声明实现的协议

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController <UICollectionViewDataSource,UICollectionViewDelegateFlowLayout>


@end

因为UICollectionViewDelegateFlowLayout这个可以继承UICollectionViewDelegate所以它就不需要声明了

在.m中添加视图

首先创建一个布局类

UICollectionViewFlowLayout *flow =[[UICollectionViewFlowLayout alloc] init];
    
    // item 的尺寸
    flow.itemSize = CGSizeMake(60, 60);
    // item 的最小间距
    flow.minimumInteritemSpacing = 10;
    
    // 最小的行距
    flow.minimumLineSpacing = 10;
    //滚动方向
    flow.scrollDirection = UICollectionViewScrollDirectionVertical;

这里设置的布局属性都是可以在代理中重新设置的

然后创建视图

UICollectionView *collectionView = [[UICollectionView alloc] initWithFrame:CGRectMake(0, 0, 320, 568) collectionViewLayout:flow];
    collectionView.delegate = self;
    collectionView.dataSource = self;
    collectionView.backgroundColor = [UIColor orangeColor];
    
    // 注册cell
    [collectionView registerClass:[UICollectionViewCell class] forCellWithReuseIdentifier:@"newCell"];
    //添加视图 
    [self.view addSubview:collectionView];


实现必须的代理

// 设置组数
- (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView
{
    return 2;
}

// 设置每组的个数
- (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section
{
    return 10;
}

// 设置cell
- (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    UICollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier:@"newCell" forIndexPath:indexPath];
    
    cell.backgroundColor = [UIColor redColor];
    return cell;
}

这了的cell可以自定义一个,用xib画。

创建一个类继承自UIColectionViewCell,勾选创建xib

在xib中实现布局

要复用cell的话,需要在右边的identifier中输入复用的标记, 比如"newCell"


最后的效果, 两组,每组10个,垂直滚动。

要实现点击事件,可以实现代理方法

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

即可。

© 著作权归作者所有

共有 人打赏支持
c
粉丝 0
博文 2
码字总数 1364
作品 0
杭州
(转)直接拿来用!最火的iOS开源项目(二)

“每一次的改变总意味着新的开始。”这句话用在iOS上可谓是再合适不过的了。GitHub上的iOS开源项目数不胜数,iOS每一次的改变,总会引发iOS开源项目的演变,从iOS 1.x到如今的iOS 7,有的项目...

孙启超
2013/06/21
0
1
一步一步学习 iOS 6 编程(第四版)正式发布

所有范例程序及其截图都采用Xcode 4.4 和Xcode 4.5 最新版开发工具,本书包含了最新的iOS 6 开发技术,如自动布局(Auto Layout)、集合视图(Collection View)等等。 新增内容包括:分割视...

entlib
2012/10/25
0
2
iOS流布局UICollectionView系列三——使用FlowLayout进行更灵活布局

iOS流布局UICollectionView系列三——使用FlowLayout进行更灵活布局 一、引言 前面的博客介绍了UICollectionView的相关方法和其协议中的方法,但对布局的管理类UICollectionViewFlowLayout没...

珲少
2015/10/27
0
2
iOS 11 下 UICollectionView 出现滚动条被 HeaderView 遮挡的问题

iOS 11 下 UICollectionView 出现滚动条被 HeaderView 遮挡的问题 在使用了的 UICollectionView 页面中,滑动页面的时候滚动条会被 HeaderView 遮挡。导致滚动条看起来是断断续续的。 问题页...

宜铜铜
2017/10/21
0
0
iOS流布局UICollectionView系列二——UICollectionView的代理方法

iOS流布局UICollectionView系列二——UICollectionView的代理方法 一、引言 在上一篇博客中,介绍了最基本的UICollectionView的使用和其中我们常用的属性和方法,也介绍了瀑布流布局的过程与...

珲少
2015/10/27
0
3

没有更多内容

加载失败,请刷新页面

加载更多

kubeadm部署kubernetes集群

一、环境要求 这里使用RHEL7.5 master、etcd:192.168.10.101,主机名:master node1:192.168.10.103,主机名:node1 node2:192.168.10.104,主机名:node2 所有机子能基于主机名通信,编辑...

人在艹木中
今天
2
0
Shell特殊符号总结以及cut,sort,wc,uniq,tee,tr,split命令

特殊符号总结一 * 任意个任意字符 ? 任意一个字符 # 注释字符 \ 脱义字符 | 管道符 # #号后的备注被忽略[root@centos01 ~]# ls a.txt # 备注 a.txt[root@centos01 ~]# a=1[root@centos01...

野雪球
今天
2
0
OSChina 周二乱弹 —— 程序员圣衣

Osc乱弹歌单(2018)请戳(这里) 【今日歌曲】 @达尔文:分享Skeeter Davis的单曲《The End of the World》 《The End of the World》- Skeeter Davis 手机党少年们想听歌,请使劲儿戳(这里...

小小编辑
今天
14
0
[ python import module ] 导入模块

import moudle_name ----> import module_name.py ---> import module_name.py文件路径 -----> sys.path (这里进行查找文件) # from app.web import Personimport app.web.Person as Pe......

_______-
昨天
5
0
Redis性能问题排查解决手册

一、性能相关的数据指标 通过Redis-cli命令行界面访问到Redis服务器,然后使用info命令获取所有与Redis服务相关的信息。通过这些信息来分析文章后面提到的一些性能指标。 nfo命令输出的数据可...

IT--小哥
昨天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部