文档章节

iOS学习9:UICollectionView的简单使用

芳仔小脚丫
 芳仔小脚丫
发布于 2013/09/09 17:28
字数 470
阅读 84295
收藏 26

本文更新 2014-06-27 

效果图


storyboard可以快速对collection和table中cell进行布局,这样得好处是你可以直观得看到cell摆放位置布局状态,并可以将复用的Cell直接放在Collection中,如果你要对cell的间距进行调整,可以方便地直接调数据

在画布上添加一个CollectionView,并创建映射,命名为myCollection,单词写错。。算鸟


cell之间的间距,通过调整Min Spacing,Cell据Collection的上下左右的距离通过调整Section Insets,cell size,header size,footer size意思都很明显了,总之大家自己调调看就知道了,将Items多添加几个看下布局,然后调整间距,得到心中最佳效果,然后将items的数量设置为1。

本文cell上是一个imageView和一个label,先添加到cell上,设置好坐标,然后新建一个UICollectionViewCell的类,命名为collectionCell,将Storyboard中的Cell的Custom Class设置为collectionCell,为imageView和Label添加映射。分别命名为imageView和titleLabel。在controller的.m文件中

#import "collectionCell.h"

在viewController中实现DataSource和Delegate, 并定义一个Array用来存放image

@interface ViewController : UIViewController<UICollectionViewDataSource,UICollectionViewDelegate>

@property (strong, nonatomic)NSMutableArray *dataMArr;// 数据源
@property (weak, nonatomic) IBOutlet UICollectionView *myConllection;// collectionView

@end

在.m中设置数据源,collection代理,并实现dataSource方法

- (void)viewDidLoad
{
    [super viewDidLoad];
    [self setUpCollection];
}

-(void)setUpCollection{
    self.dataMArr = [NSMutableArray array];
    for(NSInteger index = 0;index<9; index++){
        UIImage *image = [UIImage imageNamed:[NSString stringWithFormat:@"%ld",(long)index+1]];
        NSString *title = [NSString stringWithFormat:@"{0,%ld}",(long)index+1];
        NSDictionary *dic = @{@"image": image, @"title":title};
        [self.dataMArr addObject:dic];
    }
    self.myConllection.delegate = self;
    self.myConllection.dataSource = self;
    

}
#pragma mark - Collection View Data Source
-(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
    return self.dataMArr.count;
}

-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{
    
    static NSString *collectionCellID = @"myCollectionCell";
    collectionCell *cell = (collectionCell *)[collectionView dequeueReusableCellWithReuseIdentifier:collectionCellID forIndexPath:indexPath];
    
    NSDictionary *dic    = self.dataMArr[indexPath.row];
    UIImage *image       = dic[@"image"];
    NSString *title      = dic[@"title"];
    
    cell.imageView.image = image;
    cell.titleLabel.text = title;
    
    return cell;
};

在这里下载源码

© 著作权归作者所有

芳仔小脚丫
粉丝 931
博文 83
码字总数 76301
作品 0
闵行
程序员
私信 提问
加载中

评论(55)

卡纳

引用来自“小新de蜡笔”的评论

我找到原因了,要在 storyboard 的 UICollectionViewCell 上添加 identifier,而在代码里注册是没用的。如果不在 storyboard 里填写 identifier,只在代码里注册 identifier,不报错也不好使。如果同时在 storyboard 里填写也在代码里注册,则同样不报错也不好使。如果不在 storyboard 里填写 identifier,也不在代码里注册 identifier,运行会报错。正确的做法是:只能在 storyboard 里填写而不能在代码里注册。。好不智能。。

引用来自“killua167”的评论

谢谢啊
请问,看了你的源代码,在iPhone4s和iPhone6Plus上运行时,cell的大小会随着屏幕大小进行变化,但是我自己创建工程并运行,结果在4s和6P上运行时,cell的大小均是一样的,请问,怎么通过storyboard来对collectionview进行适配呢?
卡纳
请问,看了你的源代码,在iPhone4s和iPhone6Plus上运行时,cell的大小会随着屏幕大小进行变化,但是我自己创建工程并运行,结果在4s和6P上运行时,cell的大小均是一样的,请问,怎么通过storyboard来对collectionview进行适配呢?
k
killua167

引用来自“小新de蜡笔”的评论

我找到原因了,要在 storyboard 的 UICollectionViewCell 上添加 identifier,而在代码里注册是没用的。如果不在 storyboard 里填写 identifier,只在代码里注册 identifier,不报错也不好使。如果同时在 storyboard 里填写也在代码里注册,则同样不报错也不好使。如果不在 storyboard 里填写 identifier,也不在代码里注册 identifier,运行会报错。正确的做法是:只能在 storyboard 里填写而不能在代码里注册。。好不智能。。
谢谢啊
小新de蜡笔
小新de蜡笔
999我找到原因了。。在- (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath这个方法里写死了一个大小,所以在 storyboard 里怎么调整 cell 的都不生效,由于 cell 高度设置得太小,所以把 label 给挤出去了。
小新de蜡笔
小新de蜡笔
1现在的问题是,我的 label 死活不显示,下断点看里面确实有内容了,但就是不显示出来。。9
小新de蜡笔
小新de蜡笔
我找到原因了,要在 storyboard 的 UICollectionViewCell 上添加 identifier,而在代码里注册是没用的。如果不在 storyboard 里填写 identifier,只在代码里注册 identifier,不报错也不好使。如果同时在 storyboard 里填写也在代码里注册,则同样不报错也不好使。如果不在 storyboard 里填写 identifier,也不在代码里注册 identifier,运行会报错。正确的做法是:只能在 storyboard 里填写而不能在代码里注册。。好不智能。。
小新de蜡笔
小新de蜡笔
亲,我在 cellForItemAtIndexPath 方法中,调用的 dequeueReusableCellWithReuseIdentifier:forIndexPath: 方法之后,返回的 collectionCell 对象里,UIImage 和 UILabel 对象全都是 nil,这是为什么呢?纠结了一天了。。
凉小鱼
1呃呃呃,原来不能直接显示,需要添加上去,不然只是占据了位置没有内容
凉小鱼
1能告诉我怎么在stroyboard上设置header吗?
芳仔小脚丫
芳仔小脚丫

引用来自“萧雨歇”的评论

芳姐,为什么storyBoard能把collectionViewCell拖到collectionView上,但是不用storyBoard,平常的UIViewController上的collectionView,不能在上面添加collectionViewCell?

就是这样的,如果不是storyborad,你得单独建一个collectionCell
iOS流布局UICollectionView系列三——使用FlowLayout进行更灵活布局

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

珲少
2015/10/27
0
2
《iOS学习9:UICollectionView的简单使用》

@芳仔小脚印 你好,想跟你请教个问题:《iOS学习9:UICollectionView的简单使用》这篇文章的Demo代码可以发我一份吗,我是一个完全的新手,这个高级控件学着太吃力了,希望得到您的帮助。本人...

布赫
2014/05/16
124
1
一步一步学习 iOS 6 编程(第四版)正式发布

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

entlib
2012/10/25
0
2
iOS流布局UICollectionView系列二——UICollectionView的代理方法

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

珲少
2015/10/27
0
3
(转)直接拿来用!最火的iOS开源项目(二)

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

孙启超
2013/06/21
0
1

没有更多内容

加载失败,请刷新页面

加载更多

Python应用:python链表示例

前言 python链表应用源码示例,需要用到python os模块方法、函数和类的应用。 首先,先简单的来了解下什么是链表?链表是一种物理存储单元上非连续、非顺序的存储结构,数据元素的逻辑顺序是...

python小白1
25分钟前
1
0
Source Insight加载源码

Source Insight是一个图形化的源代码查看工具(当然也可以作为编译工具)。如果一个项目的源代码较多,此工具可以很方便地查找到源代码自建的依赖关系。 1.创建工程 下图为Snort源代码的文件...

天王盖地虎626
27分钟前
0
0
nginx-rtmp-module的缺陷分析(二)

nginx-rtmp-module使用指令push和pull来relay媒体流数据,以便分布式部署服务。 当nginx-rtmp-module作为边缘服务器(一般不会向边缘服务器推流)时,使用pull从源服务器获取媒体流数据,俗称...

YoungSagit
27分钟前
0
0
代理模式

保护代理和虚拟代理 虚拟代理 把开销大的操作等到需要执行创建的时候再去执行创建 var myImage = +function () { var imgNode = document.createElement('img'); docume......

莫西摩西
35分钟前
2
0
从国企到互联网,程序员六年四段工作经历,一份被很多 HR都 刷掉的简历!

程序员,六年,四段工作经历,这也许是一份会被很多 HR 刷掉的简历。 从学生时代至今,我经历了两次大的方向转型和一次大的技术转型: 从偏理论推导的数学科学到重工程实践的计算机学科,从「...

我最喜欢三大框架
今天
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部