React Native 按住,将手指拖到另一个可触摸的地方并通过该视图捕获触摸
React Native press and hold, drag finger to another touchable and capture touch by that view
在我的 React Native 应用程序中,我试图让用户可以长按按钮,并且 无需抬起手指,能够与另一个视图进行交互。这大致是我想要的:
把它想象成 3D touch/long 按下在 iOS 13/14 之前的工作方式(取决于系统和设备中的位置):例如,用户 3D 触摸或长按按钮一个应用程序图标,并弹出一个上下文菜单。然后,用户可以无需抬起手指,将鼠标悬停在其中一个按钮上并松开手指,触发按钮点击。
我可以完全控制我的按钮、可触摸对象和视图(甚至标签栏都是自定义的,与我上面制作的插图相反)。
我怎样才能做到这一点? (我正在使用 React Native 0.63)
可能有更好的解决方案,但我想使用手势响应系统
https://reactnative.dev/docs/gesture-responder-system
您可以拥有一个包含标签栏和按钮的单一容器视图。然后监听 onResponderMove
事件来决定这些按钮何时出现。例如,当 locationY
超过某个值时可能会发生这种情况。
您还可以使用 onResponderRelease
事件(再次借助 locationX
和 locationY
参数)来确定手指是否在按钮上方松开。
在我的 React Native 应用程序中,我试图让用户可以长按按钮,并且 无需抬起手指,能够与另一个视图进行交互。这大致是我想要的:
把它想象成 3D touch/long 按下在 iOS 13/14 之前的工作方式(取决于系统和设备中的位置):例如,用户 3D 触摸或长按按钮一个应用程序图标,并弹出一个上下文菜单。然后,用户可以无需抬起手指,将鼠标悬停在其中一个按钮上并松开手指,触发按钮点击。
我可以完全控制我的按钮、可触摸对象和视图(甚至标签栏都是自定义的,与我上面制作的插图相反)。
我怎样才能做到这一点? (我正在使用 React Native 0.63)
可能有更好的解决方案,但我想使用手势响应系统
https://reactnative.dev/docs/gesture-responder-system
您可以拥有一个包含标签栏和按钮的单一容器视图。然后监听 onResponderMove
事件来决定这些按钮何时出现。例如,当 locationY
超过某个值时可能会发生这种情况。
您还可以使用 onResponderRelease
事件(再次借助 locationX
和 locationY
参数)来确定手指是否在按钮上方松开。