以前看见的
印物App
里的定制模块的TableView
效果仍是不错的,因此仿这个App实现了最主要的亮点之一TableView
滚动效果(层叠效果)。cell
中的细节功能是没有添加的, 须要的话你们能够本身进行扩展添加!git
首先TableView
与cell
的初始化过程就很少解释了, 接下来咱们来看看重要的代码实现:github
cell
中的方法须要用到2个属性来帮助咱们实现这个方法ui
//底层View
@property (nonatomic, weak)UIView *backGView;
//上层Image
@property (nonatomic, weak)UIImageView *backGImage;
//这个方法是咱们主要实现的核心代码
/** cell偏移设置*/
- (void)cellOffsetOnTabelView:(UITableView *)tabelView;复制代码
思路:atom
1.须要规定一个固定的currentLocation
值spa
2.若是cell
的Y
值小于tabelView.contentOffset.y
值(超出 屏幕上面的位置), 须要进行一次处理(中止cell
偏移)code
3.若是cell
的Y
值在currentLocation
范围内须要进行二次处理(进行cell
偏移)cdn
4.最后cell
的Y
值在currentLocation
下面位置进行三次处理(设置初始值), 以下代码:get
//cell偏移量实现
- (void)cellOffsetOnTabelView:(UITableView *)tabelView
{
CGFloat currentLocation = tabelView.contentOffset.y + LRLastCellHeight;
//若是须要能够打开下面这段代码
#if 0
//下拉禁止 第一个cell往下移动
if (currentLocation < LRCellHeight) return;
#endif
//若是超出规定的位置以 ->“上”
if (self.frame.origin.y < tabelView.contentOffset.y + LRLastCellHeight - LRCellHeight) {
self.backGView.height = LRLastCellHeight;
self.backGView.y = - (LRLastCellHeight - LRCellHeight);
}else if (self.frame.origin.y <= currentlocation="" &&="" self.frame.origin.y="">= tabelView.contentOffset.y) {//cell开始进入规定的位置
//经过绝对值 取出移动的Y值
CGFloat moveY = ABS(self.frame.origin.y - currentLocation) / LRCellHeight * (LRLastCellHeight - LRCellHeight);
//每次进来把当前cell提到最上层
[self.superview bringSubviewToFront:self];
//移动的值 + cell固定高度
self.backGView.height = LRCellHeight + moveY;
//设置偏移量Y值
self.backGView.y = - moveY;
}else{//超出规定的位置以 ->“下”
self.backGView.height = LRCellHeight;
self.backGView.y = 0;
}
}
复制代码
主要核心代码实现完, 其余部分在ViewController
调用就很是简单了:it
#pragma mark -- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section { return 10; } - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { LREffectCell * effectCell = [LREffectCell cellFromTableView:tableView]; return effectCell; } - (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath { //cell 将要显示时候咱们把数据给它 LREffectCell * effectCell = (LREffectCell *)cell; effectCell.backGImage.image = LRGetImage(indexPath.row); //初始化 -> 调用第一次滚动 [effectCell cellOffsetOnTabelView:_tableView]; } - (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath { return LRCellHeight; } 复制代码
最后须要监听scrollView
滚动实现cell偏移:io
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
// [_tableView visibleCells]:获取表视图的可见单元格。(可见的视图)
//遍历
[[_tableView visibleCells] enumerateObjectsUsingBlock:^(LREffectCell * _Nonnull obj, NSUInteger idx, BOOL * _Nonnull stop) {
//cell偏移设置
[obj cellOffsetOnTabelView:_tableView];
}];
}复制代码
效果图失帧严重建议去GitHub - 点击下载 运行效果会更明显, 若是喜欢的小伙伴请点一个赞吧,欢迎留言补充与给出不足之处! 原文阅读