collectionView,tableView的细节处理

1.设置collectionView的高度

1.1为什么要设置高度?

collectionView是在tableView的footView里面 , tableView能滚动,collectionView也能滚动 我们不想让collectionView滚动

1.2怎么可以让collectionView不滚动?

只要collectionView里面的内容不超出collectionView的最大高度就可以了

1.3怎么设置collectionView的高度

计算出collectionView内容高度 = collectionView的高度

1.4怎么计算collectionView内容的高度

设置collectionView高度 = 内容高度(rowsitemWH + (rows - 1) margin)

总行数 cell的高度 + (总行数 - 1) *行间距

1.5怎么计算总行数

计算总行数:(count - 1) / cols + 1 万能公式 记住

(模型的总数 - 1) / 每一行有多少个cell(item) + 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怎么验证?

打印cell的frame

  - (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的基础上类加得出来的

时间: 2024-08-29 01:45:11

collectionView,tableView的细节处理的相关文章

用Swift开发Mac App(7)

缩放 打开MasterViewController.xib,在Size面板中查看 Custome View的大小.在本例中,它应该是540x400大小.但是读者的这个数字会有不同.不管是多大,请记下这个数字.待会会用到. 这将是App出口的最小大小.打开 MainMenu.xib, 选择 window 对象.在Size 面板中,勾上Constraint右边的Minimum Size 选项,然后将width 和 height 修改为同样的值. 运行程序. 改变出口的大小,这次当窗口缩小到最小尺寸后

UIScrollViewDelegate 方法调用

UIScrollViewDelegate 方法调用 /** 设置缩放的View, 初始化完之后调用此方法告诉scrollView 谁可以缩放操作, 然后进行布局 */ func viewForZoomingInScrollView(scrollView: UIScrollView) -> UIView? { print("viewForZoomingInScrollView") return imageView } /** 缩放进行中调用 */ func scrollViewDi

ios 两个 TableView 之间的联动, TableView 与 CollectionView 之间的联动

两个 TableView 之间的联动, TableView 与 CollectionView 之间的联动 这是一个创建于 359 天前的主题,其中的信息可能已经有所发展或是发生改变. [联动] :两个 TableView 之间的联动, TableView 与 CollectionView 之间的联动 前言 现在市面上有很多 app 都有联动功能,有的是两个 TableView 之间的联动,比如美团外卖,百度外卖,饿了么等等.有的是 TableView 与 CollectionView 之间的联动

TableView 的Plain 状态下小细节

(细节)TableView 中,在 Style 的 Plain 状态下,下滑行,顶部 Title 会一直显示,直到末尾 在 Grouped  状态下不会

collectionView 和 tableView的嵌套使用

#import "ViewController.h" #define HEIGHT [UIScreen mainScreen].bounds.size.height #define WIDTH [UIScreen mainScreen].bounds.size.width @interface ViewController ()<UICollectionViewDelegate,UICollectionViewDataSource,UITableViewDelegate,UITa

iOS下用一行代码实现tableview(collectionview)的parallax效果

效果和https://github.com/jberlana/JBParallaxCell一样.实现cell的滚动视差. 原理很简单,就是一个等比公式  cell的图片位置 / cell图片可以滑动的总长 = cell在table中的位置 / cell 可滑动总长  实现方法: 1> 在cell的UIImageView上添加父视图UIView,clipsToBounds设置为yes,用来剪切UIImageView,为其限定大小. 2>在vc的 -(void)scrollViewDidScrol

ios开发之-- tableview/collectionview获取当前点击的cell

方法如下: 一般collectionView 或者 tableview都有自带的点击函数,如下: 1, collectionView -(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath{ //一般情况,cell不是自定义 UICollectionViewCell * cell = (UICollectionViewCell *)[col

iOS 高效的分页加载(TableView、CollectionView)

一.tableview的分页加载的代码对比 没有优化之前的代码如下 [strongSelf.tableView.mj_footer endRefreshing]: [strongSelf.articleArr addObjectsFromArray:feedList]; [strongSelf.tableView reloadData]; 优化之后的代码 NSMutableArray *indexPaths = [NSMutableArray array]; [feedList enumerat

SYRefresh 一款简洁易用的刷新控件 支持tableview,collectionview水平垂直刷新功能

SYRefresh 地址: https://github.com/shushaoyong/SYRefresh 一款简洁易用的刷新控件 示例程序:   默认刷新控件使用方法: //添加头部刷新控件 ScrollView.sy_header = [SYRefreshView refreshWithHeight:40 isFooter:NO completionBlock:^{ dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(2 *