不知道写了多少次collectionview,步了很多坑,现在看来虽然达到了自己想要的结果,却不知道其中所以然。还是总结一下,免得再走弯路;

场景是这样的,我要定制一个显示选择图片的排列,想要实现横向排列4个,等间距,多了折行显示的效果,正确的做法是这样的;

- (void)viewDidLoad {
[super viewDidLoad];
self.navigationController.navigationBar.translucent = NO;
if ([self respondsToSelector:@selector(setAutomaticallyAdjustsScrollViewInsets:)]) {
self.automaticallyAdjustsScrollViewInsets = NO;
}
self.view.backgroundColor = [UIColor purpleColor];
self.photoArray = @[[UIImage imageNamed:@"cycle3"],[UIImage imageNamed:@"cycle4"],[UIImage imageNamed:@"cycle2"],[UIImage imageNamed:@"cycle3"],[UIImage imageNamed:@"cycle4"],].mutableCopy;
[self.view addSubview:self.pickPhotoCollection];
} -(UICollectionView *)pickPhotoCollection{
if (!_pickPhotoCollection) {
UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc]init];
layout.scrollDirection = UICollectionViewScrollDirectionVertical;
_pickPhotoCollection = [[UICollectionView alloc]initWithFrame:CGRectMake(, , kScreenWidth, (self.photoArray.count/ +)*) collectionViewLayout:layout];
_pickPhotoCollection.delegate = self;
_pickPhotoCollection.dataSource = self;
_pickPhotoCollection.backgroundColor = RGBACOLOR(, , , );
_pickPhotoCollection.showsHorizontalScrollIndicator = NO; [_pickPhotoCollection registerClass:[XJPickPhotoCollectionViewCell class] forCellWithReuseIdentifier:NSStringFromClass([XJPickPhotoCollectionViewCell class])];
}
return _pickPhotoCollection;
}
-(NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView{
return ;
} -(NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section{
return self.photoArray.count + > ? : self.photoArray.count +;
} -(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath{ XJPickPhotoCollectionViewCell *cell = (XJPickPhotoCollectionViewCell *)[collectionView dequeueReusableCellWithReuseIdentifier:NSStringFromClass([XJPickPhotoCollectionViewCell class]) forIndexPath:indexPath];
//判断图片的显示方式 如果不是9张图 则显示可以继续添加
if (self.photoArray.count == ) {
cell.photoImageView.image = self.photoArray[indexPath.row];
return cell;
} if (indexPath.row == self.photoArray.count) {
cell.photoImageView.image = [UIImage imageNamed:@"addPhoto"];
}else{
cell.photoImageView.image = self.photoArray[indexPath.row];
} return cell;
} -(CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath{
return CGSizeMake(WidthScale(), WidthScale());
}
-(CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumInteritemSpacingForSectionAtIndex:(NSInteger)section{
// return 2;
return (kScreen_width - WidthScale()* - )/.;
}
//-(CGFloat)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout minimumLineSpacingForSectionAtIndex:(NSInteger)section{
// return (kScreen_width - WidthScale(70)*4 - 10 )/3.;
//}
-(UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout *)collectionViewLayout insetForSectionAtIndex:(NSInteger)section{
return UIEdgeInsetsMake(, , , );
}

关键点在这里:

1-===layout.scrolldirection = uicollectionViewScrollDirectionVertical;collection的滚动方向,由于要折行向下,所以方向是垂直方向,在排列的时候会默认选择先将横向排列完毕,折行向下。

2--=== minmumlinespaceing 这个这个属性用来指示行与行之间的最小距离(纵向),或者列与列之间的最小距离(横向)。无论横向或者纵向,都可以滚动显示所有内容,所以这个属性可以单独设置。  SO 在不同的滚动方向上要分清楚他的作用,我就是在这里弄的头晕目眩;  当然interitem就很好理解了

另外还有一点是   如果是自定义的layout,layout的代理方法是不会执行的,若想达到相同的效果,需要在自定义的layout内部进行处理!

layout.scrollDirection = UICollectionViewScrollDirectionVertical;

关于collectionview布局的坑的更多相关文章

  1. ListView Viewholder的坑 线性布局的坑

    1.ListView Viewholder的坑 /** * 默认带图片的menu adapter */ public static class MenuImageAdapter extends Bas ...

  2. collectionView布局原理及瀑布流布局方式

    一直以来都想研究瀑布流的具体实现方法(起因是因为一则男女程序员应聘的笑话,做程序的朋友应该都知道).最近学习到了瀑布流的实现方法,瀑布流的实现方式有多种,这里应用collectionView来重写其U ...

  3. Dynamic支持CollectionView布局 、 MotionEffects特效 、 BlurImage效果 、 TextKit

    1 使用UIDynamicAnimator对集合视图进行布局 1.1 问题 UIKit Dynamic动力模型一个非常有趣的用途就是影响集合视图的布局,可以给集合视图的布局添加各种动力行为,使其产生丰 ...

  4. collectionView布局原理及瀑布流布局方式--备用

    最近学习到了瀑布流的实现方法,瀑布流的实现方式有多种,这里应用collectionView来重写其UICollectionViewLayout进行布局是最为简单方便的.但再用其布局之前必须了解其布局原 ...

  5. collectionView布局

    关于 collectionView的layout布局方法: 设置cell的间距,行间距,组与组之间的间距,都是在layout里面来设置. 包括,滚动方向. -(void)prepareLayout [ ...

  6. 个人经验 - Android的RelativeLayout布局的layout_height属性设置为wrap_content时的坑

    Android的RelativeLayout布局的layout_height属性设置为wrap_content时的坑: 此坑出现的条件: 1.RelativeLayout布局的layout_heigh ...

  7. iOS开发 tableView点击下拉扩展 + 内嵌collectionView上传图片效果

    ---恢复内容开始--- //需要的效果 1.设置window的根视图控制器为一个UITableViewController #import "AppDelegate.h"#imp ...

  8. iOS 第三方库、插件、知名博客总结

    iOS 第三方库.插件.知名博客总结 用到的组件 1.通过CocoaPods安装 项目名称 项目信息 AFNetworking 网络请求组件 FMDB 本地数据库组件 SDWebImage 多个缩略图 ...

  9. 移动端H5---页面适配问题详谈(一)

    一.前言 昨天唠叨了哈没用的,今天说点有用的把.先说一下响应式布局吧,我一直认为响应式布局的分项目,一下布局简单得项目做响应式还是可以可以得.例如博客.后台管理系统等.但是有些会认为响应式很牛逼,尤其 ...

随机推荐

  1. Redis消息之发布与订阅

    "发布/订阅"可以实现进程间的消息传递 发布的消息不会持久化,只能收到订阅后的消息,执行subscribe命令后客户端会进入"订阅"状态,处于此状态下的客户端不 ...

  2. 理解css相邻兄弟选择器

    今天在菜鸟教程看到了css组合选择符的“相邻兄弟选择器”,刚开始对这个概念有些不太理解,通过查阅资料并且经过一些试验总算有了些头绪. 原文解释是“相邻兄弟选择器(Adjacent sibling se ...

  3. English trip M1 - PC6 Likes and Dislike Teacher:Jade

    In this lesson you will learn to talk about likes and dislikes. 课上内容(Lesson) # 通常在习惯性的表达式用 it's 来表达w ...

  4. org.hibernate.id.IdentifierGenerationException

    [问题]org.hibernate.id.IdentifierGenerationException: ids for this class must be manually assigned bef ...

  5. 如何理解以太坊ABI - 应用程序二进制接口

    很多同学不是很明白以太坊ABI是什么,他的作用是什么,读完本文就明白了. 写在前面 阅读本文前,你应该对以太坊.智能合约有所了解, 如果你还不了解,建议你先看以太坊是什么,也可以观看我们的视频:零基础 ...

  6. webpack添加热更新

    之前的wbepack一直没有加上热更新,这是一种遗憾,今天终于加上去了,看不懂我博客的可以看这篇文章:http://blog.csdn.net/hyy1115/article/details/5302 ...

  7. 0.11内核rd_load@ramdisk.c中memcpy函数好像有bug

    0.11内核rd_load@ramdisk.c中memcpy函数好像有bug,如:#define memcpy(dst,src,n) \    __asm__("cld;rep;movsl& ...

  8. php正则的使用

    函数 描述 preg_filter 执行一个正则表达式搜索和替换 preg_grep 返回匹配模式的数组条目 preg_last_error 返回最后一个PCRE正则执行产生的错误代码 preg_ma ...

  9. 4.2 面向对象分析(二) CRC方法标识概念类

    CRC  又称为CRC索引卡片:CRC card  每张卡片代表一个类 Each card represents one class  每张卡片上写出这个类承担的职责.与其合作交互的其他类名   ...

  10. raw_input 和input 区别

    raw_input() 直接读取控制台的输入(任何类型的输入它都可以接收).而对于 input() ,它希望能够读取一个合法的 python 表达式,即你输入字符串的时候必须使用引号将它括起来,否则它 ...