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)scrollViewDidScroll:(UIScrollView *)scrollView

中实时更新每个cell的图片位置。

代码如下


-(void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    for(WELTableViewCell * cell in [self.tableView visibleCells])
    {
        cell.image.frame = CGRectOffset(cell.image.frame, 0, ((cell.image.frame.size.height - cell.imageFrameView.frame.size.height) * ((cell.frame.origin.y + cell.imageFrameView.frame.size.height - self.tableView.contentOffset.y) / (self.tableView.frame.size.height + cell.imageFrameView.frame.size.height * 2)) + cell.imageFrameView.frame.size.height - cell.image.frame.size.height) - cell.image.frame.origin.y);
    }
}

PS:确实是一行代码,哈哈。其实一行代码只是一个噱头,完全可以多写几行增加可读性。之所以写一行代码,是想表达这个效果其实蛮简单的。用算式算出偏移量,重设frame。


3》在tableView初次刷新完毕后,调用

[self scrollViewDidScroll:nil];

例如

-(void)viewDidAppear:(BOOL)animated

{

    [super viewDidAppear:YES];

    [self scrollViewDidScroll:nil];

}


最后,附上源代码demo(发帖不易,讨个积分,哈哈)

简单demo(附注释)


以上


iOS下用一行代码实现tableview(collectionview)的parallax效果,布布扣,bubuko.com

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

上一篇:RESTful API 设计规范


下一篇:安装k8s出现 Failed to list *api.Node: Get http://192.168.144.131:8080...: dial tcp 192.168.144.131:8080: getsockopt: no route to