React Native - 长按并显示额外信息

Question

在 React Native 中，我想实现以下结果（示例）： example1example2

在长按图像（或 touchableOpacity）时，我希望显示一些额外信息（可能是图像或文本）的叠加视图。当手指离开屏幕时信息消失。我在想它是否与覆盖视图和 setState 相关，但我找不到仅在长按时出现视图的功能。有没有办法做到这一点？或者有没有可以提供解决方案的模块？

任何帮助将不胜感激！

Answer 1

如果您使用的是最新的 react native 版本，您可以使用可按下组件的 onPressOut 功能：https://reactnative.dev/docs/pressable。

使用 onLongPress（或 onPressIn，但它不是一个好的 UX）函数触发显示叠加层，然后使用 onPressOut 函数触发隐藏叠加层。

对于叠加层，我建议您使用一个很酷的库，例如： https://reactnativeelements.com/docs/tooltip/