仿京东、淘宝商品详情中上滑tableView的cell与headerView之间的动画效果

在做项目时涉及到仿照京东商品详情详情做，在网上找了好多demo，其他都实现了，只有一个动画效果没有实现，就是在滑动tableView时他的headerView与cell之间的过渡效果没有实现出来，找了好多方法，有的是用三方实现的，我觉得一个动画效果用个三方有点浪费了，就自己通过计算写了一个方法，其实也挺简单，就是计算出cell和header之间的滑动范围，再加上一个过渡动画就OK了，废话少说，上代码：

首先定义轮播图的父视图和headerView的父视图  并定义tableView

@property (nonatomic, strong) UIScrollView *scrollView;

@property (nonatomic, strong) UITableView *tableView;

@property (nonatomic, strong) UIView *headerView;

然后

- (void)viewDidLoad {

    [super viewDidLoad];    

    self.tableView.delegate = self;

    self.tableView.dataSource = self;

    [self createHeader];//创建headerView和轮播图

    self.tableView.tableHeaderView = self.headerView;

}

最后滑动过渡效果的能够实现的关键代码

- (void)scrollViewDidScroll:(UIScrollView *)scrollView

{

    

    CGFloat offset = scrollView.contentOffset.y;

    

    if (scrollView == self.tableView) {

        

        // 重新赋值，就不会有用力拖拽时的回弹

        self.headerScrollView.contentOffset = CGPointMake(self.headerScrollView.contentOffset.x, 0);

        

        if (offset <= ScreenWidth && self.tableView.contentOffset.y > 0) {

            

            self.headerScrollView.contentOffset = CGPointMake(self.headerScrollView.contentOffset.x, -offset / 2.0f);

            self.navigationController.navigationBar.alpha = offset / ScreenWidth;//导航栏渐变效果 可以不加

        }

        //下面的两个else if都是解决用力拖拽时的问题

        else if (self.tableView.contentOffset.y <= 0)

        {

            self.navigationController.navigationBar.alpha = 0;//导航栏 效果 可以不加

        }else

        {

            self.navigationController.navigationBar.alpha = 1;//导航栏 效果 可以不加

        }

    }else if (scrollView == self.scrollView) {

        self.pageControl.currentPage = scrollView.contentOffset.x/ScreenWidth;//小点点  

    }

    

}

把代码直接复制粘贴就可以了。。。

如果有用就顶一下吧。。。。。