关于 iOS 手势交互的一个问题,问了一圈居然无人能解,难道在 iOS 上实现这个手势交互是个无解的难题?

2018-04-19 08:28:19 +08:00
 forkon

[前提] scrollViewA 和 scrollViewB 在同一个父视图里面,不嵌套,且 scrollViewA 在 scrollViewB 的之上。

[要实现的交互] 手指先是在 scrollViewA 里面向上滑动,当 scrollViewA 滚动到最底下时,scrollViewB 接着滚动,这个过程中手指从未抬起(相当于 touch 事件从 scrollViewA 传到了 scrollViewB ?)。

+-----------------------------------+ | | | | | | | | | | ^ | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | scrollViewA | | | | | + | | | | | | | +---------------------------+ | | | | | | | | scrollViewB | | | | | +-----------------------------------+

11909 次点击
所在节点    iDev
60 条回复
elgae
2018-04-19 10:11:28 +08:00
elgae
2018-04-19 10:11:49 +08:00
@C90 强行 hitTest
forkon
2018-04-19 10:12:11 +08:00
@sunhr 我现在用的就是类似这种方法,但是效果不理想,手指抬起之后,scrollView 没有一个减速停止的过程。

@zvving 设计上是在上面的 scrollView 的背景色是半透明的,当点击下面的 scrollView 上的内容时,上面的 scrollView 作相应的显示。

@dcty 达不到设计的要求。

@itenyh 感谢,我也小激动了一把,不过,A 和 B 的 userInteractionEnabled 都不能为 NO,还有其它 touch 事件要处理。
amon
2018-04-19 10:12:29 +08:00
这样的交互简直是爆炸。
建议弄成一个 ScrollView,或者 TableView。
forkon
2018-04-19 10:22:51 +08:00
@elgae
@C90

hitTest 也试过了,hitTest 只有在手指按下的瞬间起作用,按下之后在滑动的过程中系统就不会对其它 view 做 hitTest 了。
loveuqian
2018-04-19 10:29:13 +08:00
为啥要这么做?
这不就是一个 table2 个 cell ?
ichanne
2018-04-19 10:38:02 +08:00
什么垃圾需求才需要这样设计,说吧,抄的哪个 App,这样问题更好解决
learnshare
2018-04-19 10:42:41 +08:00
我感觉这个交互不是很自然,一个页面中可滚动区域应该最多只有一个
forkon
2018-04-19 10:46:16 +08:00
@ichanne
@learnshare

从设计师的描述来看这样的效果还是蛮不错的,哈哈。
ichanne
2018-04-19 10:47:40 +08:00
@forkon #29 直接问设计师抄的哪个 App
cnbobolee
2018-04-19 10:49:15 +08:00
按你说的原理上是不行的,上面滑动到底,手指不离开事件不会转移到下面的 scrollView,但是实现你这个需求可以用其他方法,比如上面 scrollView 和下面 scrollView 进行通信。
sunhr
2018-04-19 10:52:30 +08:00
@forkon 要减速效果,自己根据 pan 的速度搞一下就好啦,很简单的
forkon
2018-04-19 10:53:56 +08:00
@snail1988

方案 1:不是很明白,scrollViewA 滑到底就滑不动了,还能让 scrollViewB 继续滑动?加 pan 手势改变 offset 的话,手指抬起没有减速停下来的效果。
方案 2:覆盖透明 scrollView,那下来的两个 scrollView 怎么接收其它的 touch 事件?
LeoNG
2018-04-19 11:02:12 +08:00
你没有说两个 scrollview 的 frame。纵向平分 super view ?
forkon
2018-04-19 11:05:44 +08:00
@cnbobolee 我在想能不能在上面的滑到底之后,把当前的 touch 事件取消掉,上面的 scrollView 的 userInteractionEnabled 临时置为 false,手指继续滑动,系统生成新的 touch 事件,此时下面的 scrollView 捕获事件……经测试,手指不抬起就不会有新的 touch 事件产生……
dcty
2018-04-19 11:08:53 +08:00
难道是第一个 Scrollview 需要做视觉差的效果?
如果说,我说的第一个方案完全满足需求,不服来辩。
forkon
2018-04-19 11:14:57 +08:00
@LeoNG 谢提醒,已补充:scrollViewB 完全覆盖其 superView (宽高一样),scrollViewA 与 scrollViewB 同宽且左上角对齐,但 scrollViewA 的高度始终要比 scrollViewB 小。

@dcty 不是视差的效果,最多可以说是联动吧。
itenyh
2018-04-19 11:15:05 +08:00
@forkon 继续谈谈 ABC 三个 scrollview 这样的架构。刚才的 16 楼的方案,有 userInteractionEnabled 必须设置为 NO 的致命问题,这其实是彻底放弃了 AB 对任何手势的响应权利。但是这个方案明显的优点在于利用 C 的手势,解决 AB 滑动以及其流畅切换的问题。
那么思考一下,我能不能在 scroll 的时候让 C 来响应,而 touch 让 AB 来响应。从更底层来思考一下,当手指触碰到屏幕并产生动作后,系统应该要决定两件事:1、谁来响应(通过 hittest ) 2、如何响应( scroll,touch......)。能不能在知道是 scroll 后让 C 来响应,touch 则 redirect 给 AB ?
kera0a
2018-04-19 11:19:40 +08:00
应该可以通过手势代理方法 shouldRecognizeSimultaneously,让两个 ScrollView 同时接受滑动手势,之后根据状态两个 ScrollView 做不同的处理(不用让手势停止,只需重载 ScrollView 获取手势事件做相应操作, 方法之后继续处理)

难点是让两个 ScrollView 同时接受手势, 但嵌套 ScrollView 的教程这么多,你多搜搜就行,我嘚吧嘚吧这么多可不想写测试代码。
forkon
2018-04-19 11:28:23 +08:00
@itenyh 很好的思路,但是似乎并不好解决,难点是怎么 touch redirect 给其它 view。

@kera0a 是我没找着吗,我看到的都是同步 contentOffset,显然这种做法在这里用不上。

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

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

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

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

© 2021 V2EX