collectionView的细节处理

1.设置collectionView的高度

1.1为什么要设置高度?
collectionView是在tableView的footView里面 , tableView能滚动,collectionView也能滚动 我们不想让collectionView滚动

1.2怎么可以让collectionView不滚动?
只要collectionView里面的内容不超出collectionView的最大高度就可以了

1.3怎么设置collectionView的高度
计算出collectionView内容高度 = collectionView的高度

1.4怎么计算collectionView内容的高度
总行数 * cell的高度 + (总行数 - 1) * 行间距 设置collectionView高度 = 内容高度(rows * itemWH + (rows - 1) * margin)

1.5怎么计算总行数
(模型的总数 - 1) / 每一行有多少个cell(item) + 1 计算总行数:(count - 1) / cols + 1 万能公式 记住

1.6代码写到哪里?
计算高度,我们先要拿到模型总数 代码写在字典转模型后面就可以 字典转模型一般写在网络请求成功回调的方法里面
还要写在刷新表格之前

2.设置tableView的滚动范围

2.1.为什么要设置滚动范围
collectionView的高度超出屏幕,我们滚动tableView查看下面的collectionViewcell 发现会弹回来

2.2.为什么会弹回来
tableView的高度会根据最后一个cell或footView的最大y值决定
footView的高度就是就是collectionView的高度,我们设置的collectionView的高度为200
上面虽然重新设置了collectionView的高度,但是在tableFooterView高度已经在设置为200的时候确定为200了

2.3.怎么修改滚动范围?
先用contentSize来设置 只要设置tableView的最大高度为collectionView内容的最大y值即可
修改后发现一个bug 当离开当前页 再返回的时候,滚动tableView 发现还会弹回来

2.4.为什么还会弹回来?
tableView的滚动范围是有系统自己设定的,我们设定的值系统不认可,不会记录,只有第一次会执行我们设置的
再次来到该界面系统就会还原自己记录的滚动范围contentSize
2.4.系统怎么设定contentSize
是根据最后一个cell或footView的最大y值决定

2.5.怎么解决弹回来的问题
我们重新设置最后一个cell或footView就可以 系统就会重新计算滚动范围

2.6.在哪设置?
首先需要拿到collectionView的frame 在网络请求成功后我们会重新计算collectionView的高度 写在计算的后面
还要写在刷新表格之前

3.处理额外的格子

3.1 为什么要处理?
服务器返回的数据不一定是列数的整数倍 这样最后一行可能只显示1个cell 后面还有一些缺口 不太美观 需要处理

3.2 怎么处理?
如果有缺口,我们只需要在缺口位置展示空的cell就可以了

3.3 怎么展示空的cell
cell的个数由模型的个数决定 , 模型的个数由模型数组元素个数(count)决定
我们只需要给模型数组添加元素(object)就可以了

3.4代码写到哪里?
我们先要拿到模型总数 代码写在字典转模型后面就可以 字典转模型一般写在网络请求成功回调的方法里面
还要写在刷新表格之前

4.处理tableView静态cell的间距

4.1间距是什么造成的?
我们的tableView的是分组样式的
分组样式tableView:默认每一组都有间距 我们猜测间距就是分组的间距

4.2怎么验证?
把分组间距设置为0来查看界面验证 发现我们的猜测是正确的
然后把分组间距设置成我们想要的间距就可以了
self.tableView.sectionHeaderHeight = 0;
self.tableView.sectionFooterHeight = 10;

4.3我们发现设置完分组间距,第一个cell距离顶部还是有一大断间距, 这个间距怎么造成的?
cell距离顶部有一段间距 只有在静态cell里面才会有这种现象
猜测是内边距 contentInset

4.4怎么验证?
打印contentInset

4.5在哪里打印?
在viewDidLoad里面不可以 View里面控件的位置尺寸还没设置
我们可以在viewDidAppear里面打印 打印完发现是64 不是这个间距
猜测是cell的y值

4.6怎么验证?
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{
UITableViewCell *cell = [tableView cellForRowAtIndexPath:indexPath];
NSLog(@"%@",NSStringFromCGRect(cell.frame));
}
我们发现y值为35 ,证明猜测是正确的

4.7怎么修改?直接修改y值?
不可以 修改一个cell的y值只会改变一个cell的位置

4.8怎么可以让整个tableView里面的cell整体往上(往下)移动
可以通过contentInset
self.tableView.contentInset = UIEdgeInsetsMake(-25, 0, 0, 0);

4.9根据上面的设置我们发现系统修改contentInset 是在我们原来的contentInset的基础上类加得出来的

推荐阅读更多精彩内容