关于collectionview布局的坑
不知道写了多少次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布局的坑的更多相关文章
- ListView Viewholder的坑 线性布局的坑
1.ListView Viewholder的坑 /** * 默认带图片的menu adapter */ public static class MenuImageAdapter extends Bas ...
- collectionView布局原理及瀑布流布局方式
一直以来都想研究瀑布流的具体实现方法(起因是因为一则男女程序员应聘的笑话,做程序的朋友应该都知道).最近学习到了瀑布流的实现方法,瀑布流的实现方式有多种,这里应用collectionView来重写其U ...
- Dynamic支持CollectionView布局 、 MotionEffects特效 、 BlurImage效果 、 TextKit
1 使用UIDynamicAnimator对集合视图进行布局 1.1 问题 UIKit Dynamic动力模型一个非常有趣的用途就是影响集合视图的布局,可以给集合视图的布局添加各种动力行为,使其产生丰 ...
- collectionView布局原理及瀑布流布局方式--备用
最近学习到了瀑布流的实现方法,瀑布流的实现方式有多种,这里应用collectionView来重写其UICollectionViewLayout进行布局是最为简单方便的.但再用其布局之前必须了解其布局原 ...
- collectionView布局
关于 collectionView的layout布局方法: 设置cell的间距,行间距,组与组之间的间距,都是在layout里面来设置. 包括,滚动方向. -(void)prepareLayout [ ...
- 个人经验 - Android的RelativeLayout布局的layout_height属性设置为wrap_content时的坑
Android的RelativeLayout布局的layout_height属性设置为wrap_content时的坑: 此坑出现的条件: 1.RelativeLayout布局的layout_heigh ...
- iOS开发 tableView点击下拉扩展 + 内嵌collectionView上传图片效果
---恢复内容开始--- //需要的效果 1.设置window的根视图控制器为一个UITableViewController #import "AppDelegate.h"#imp ...
- iOS 第三方库、插件、知名博客总结
iOS 第三方库.插件.知名博客总结 用到的组件 1.通过CocoaPods安装 项目名称 项目信息 AFNetworking 网络请求组件 FMDB 本地数据库组件 SDWebImage 多个缩略图 ...
- 移动端H5---页面适配问题详谈(一)
一.前言 昨天唠叨了哈没用的,今天说点有用的把.先说一下响应式布局吧,我一直认为响应式布局的分项目,一下布局简单得项目做响应式还是可以可以得.例如博客.后台管理系统等.但是有些会认为响应式很牛逼,尤其 ...
随机推荐
- Go语言学习之1 基本概念、环境搭建、第一个Go程序
一.环境搭建 见我的这篇博客 https://www.cnblogs.com/xuejiale/p/10258244.html 二.golang语言特性1. 垃圾回收 1) 内存自动回收,再也不 ...
- JavaScript 第一章总结
A quick dip into javascipt The way JavaScript works HTML 用一系列的 markup 来呈现整个 content 的 structure.CSS ...
- python3-知识扩展扫盲易忘-zip的用法
>>>a = [1,2,3] >>> b = [4,5,6]>>> c = [4,5,6,7,8]>>> zipped = zi ...
- 如何使用Web3.js API 在页面中进行转账
本文介绍如何使用Web3.js API 在页面中进行转账,是我翻译的文档Web3.js 0.2x 中文版 及 区块链全栈-以太坊DAPP开发实战 中Demo的文章说明. 写在前面 阅读本文前,你应该对 ...
- 关于Android 主题的那些事
最近遇到了一个问题,主题的ActionBar的Title 颜色是黑色的 但是我的主界面由于用的是CoordinateLayot所以是白色的 整个黑色的就很难看 所以也想要把ActionBar 的Tit ...
- 有标号的DAG计数
看了某神仙博客学了一手,基本的思路就是容斥入度为0的点. n^2做法. F(n)=sigema i (-1)^(i-1)✖ C(n,i)✖ F(i)✖ 2^(j*(i-j)) nlogn做法 对上述式 ...
- 【其他】【navicat】【1】navicat导入txt文件中文乱码问题解决
正文: TXT文件默认编码为ANSI,另存为编码为UTF-8的文本文件即可 备注: 1,一般需要导入的数据都是一张excel表,需要将excel表另存为“文本文件(制表符分隔)(*.txt)”保存类型 ...
- python-day73--django-用户验证
一.auth模块 from django.contrib import auth django.contrib.auth中提供了许多方法,这里主要介绍其中的三个: 1 .authenticate() ...
- antd-mobile的DatePicker日期选择组件使用
现在项目上有个需求,在时间选择上需要精确到分钟,且分钟只能是0分钟或者是30分钟. 使用了antd-mobile的DatePicker组件,具体用法可参考:https://mobile.ant.des ...
- .NET 高效开发之不可错过的实用工具(第一的当然是ReSharper插件)
工欲善其事,必先利其器,没有好的工具,怎么能高效的开发出高质量的代码呢?本文为 ASP.NET 开发者介绍一些高效实用的工具,包括 SQL 管理,VS插件,内存管理,诊断工具等,涉及开发过程的各个环节 ...