求教网易云音乐这个滑动效果是如何做的?

2016-06-23 15:32:04 +08:00
 EPCoo

如图:当 cell 滚动到顶部的时候,改变这个 view 的 Y 值。

我首先想到是

- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    if (scrollView.contentOffset.y <= 0)
    {
        CGPoint offset = scrollView.contentOffset;
        offset.y = 0;
        scrollView.contentOffset = offset;
        
    }
}

但是问题来了,我把 contentOffset.y = 0 之后虽然到顶部没有弹簧效果了,但是。。。拿不到滚动的值了。

于是我想到添加手势,给 UITableView 添加手势,然后在滚动到顶部的时候,获取手指移动的偏移的位置, 但是效果很不理想,手势方法总被 cell 点击拦截。

请教如何做到图中这么丝滑的滚动!

3700 次点击
所在节点    iDev
8 条回复
rvw
2016-06-23 16:00:27 +08:00
网易的我看了到顶部也没有弹簧效果吧
finab
2016-06-23 16:12:28 +08:00
我正好实现了一个,给你整理下代码吧。主要是处理两个手势,将事件传递
finab
2016-06-23 16:28:13 +08:00
首先你要有一个 pan 手势,作用是将这个 UITableView 拖下去(将 UITableView 滚动禁用 测试这个手势工作正常)

然后你需要继承一个 UITableView ,重写里面的
- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer;
方法
这个方法作用是系统询问两个手势是否同时接收消息 , gestureRecognizer 就是你这个 UITableView 的滑动手势(如果有其他手势,记得判断)
otherGestureRecognizer 是其他手势,(一般来讲 当你这个 UITableView 不能接受手势时,能响应的手势。可能会有很多,所以你得判断哪个手势是你之前定义的移动 UITableView 的手势)


在方法内判断 self.contentOffset.y<=0 ,并且 otherGestureRecognizer 是你移动 UITableView 的那个手势。则 return YES 。让两个手势同时起作用

至于弹性效果,则你自己处理下就行
EPCoo
2016-06-23 16:31:45 +08:00
@rvw 这是个查看歌曲信息的视图

@finab 我也尝试添加手势,但是手势传递有些错乱(有的时候会被 cell 点击拦截,有的只有滚动,没有走 touchesMoved ),不太清楚底层被做了什么东东?@@
finab
2016-06-23 16:35:48 +08:00
@EPCoo 你可以去专门学习下 iOS 的手势传递机制,最好能明白你自己的 UI 上所有手势的传递
手势是有一套固定逻辑处理的,不是玄学。你只要懂它的运行机制,就能随意掌控它。

上面我说的肯定能实现你这个功能, pan 手势在你滑动 UITableView 的时候,是一定会触发的,它的作用就是让 UITableView 能滑动,是 UIScrollView 的一个手势。所以你这个需求,其实是没 cell 什么事的。你可能 pan 加的位置不对
EPCoo
2016-06-23 16:38:15 +08:00
@finab 我刚才是这么做的,继承 UITableView , 然后重写里面的 touch 方法, 然后在 外面的 View 里给 这个 tableview 添加一个 pan 手势,但是,就像我刚才说的事件传递会有问题。
刚看到你的回复。。。。
我去尝试一下你的方法!非常感谢!
jackisnotspirate
2016-06-23 16:50:01 +08:00
用一个 container 把他们包起来,然后 hittest
EPCoo
2016-06-23 20:50:10 +08:00
@finab 你好,现在虽然在手势上没有问题了,但是在计算偏移量的时候,总是不准确。
不能用 手指的偏移量,因为下拉的时候,手指还会上下移动,导致这个手指的偏移量是不能做参考的,但是如果用 UIScrollView 的 contentOffset.y 的话,快速移动得到的值却不是平滑的。。。。
能麻烦你写一个 DEMO 吗?

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/287816

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX