什么时候使用触摸原生反馈,触摸高光或触摸不透明?

在反应本机中,至少有三种方法来制作按钮: TouchableNativeFeedbackTouchableHighlightTouchableOpacity。还有 TouchableWithoutFeedback,文档明确指出你不应该使用它,因为“所有响应按下的元素应该有一个触摸时的视觉反馈”。

这三者之间还有什么显著差异吗?其中一个是 goto 组件吗?在什么情况下应该使用 TouchableHighlight而不是 TouchableOpacity?对性能有什么影响吗?

我现在正在编写一个应用程序,发现这三个应用程序在点击和操作之间有一个显著的延迟(在本例中是导航更改)。有什么办法能让它更快一点吗?

52773 次浏览

如果你愿意的话

  • highlight button on press — use TouchableHighlight
  • 改变按钮的不透明度ーー使用 TouchableOpacity

我通常是这样决定用什么的:

  • 如果我只为 Android 构建,而且组件足够大,本地反馈与使用其他组件明显不同,那么我使用 TouchableNativeFeedback
  • 如果我想控制组件的不透明度,或者我想让按钮在触摸时有颜色,而我不想控制 Touchable 内部某些元素的聚焦状态,那么我使用 TouchableHighlight。(当你自己控制不透明度时,TouchableOpacity有一些奇怪的部分)。
  • In all other cases, I use TouchableOpacity because it's more "bare" than TouchableHighlight

我认为文件中所说的主要本质区别是:

TouchableHighlight must have one child (not zero or more than one). If you wish to have several child components, wrap them in a View.链接

触摸高光

TouchableHighlight 用于使视图正确响应的包装器 按下时,包装视图的不透明度降低, 它允许底层的颜色显示通过,变暗或着色 风景。

底层来自将孩子包装在新的视图中,这样可以 影响布局,有时造成不必要的视觉工件,如果没有 正确使用,例如,如果包装视图的 backoundColor 没有显式设置为不透明颜色。

触摸不透明度

TouchableOpacity # 一个让视图正确响应的包装器 按下时,包装视图的不透明度降低, dimming it.

来源: https://medium.com/differential/better-cross-platform-react-native-components-cb8aadeba472,作者: Nick Wientge

TouchableHighlight

•用途: 当按下时,会使元素的背景变暗或变亮。

什么时候使用: 在 iOS 上,可触摸的元素或按钮有一个实心的形状或背景,在 ListView 项目上。

TouchableOpacity

•它的作用: 当按下时,减轻了整个元素的不透明度。

•何时使用: 在 iOS 系统上,可触摸的元素是独立的文本或图标,没有背景颜色。

TouchableNativeFeedback

•功能: 在按下时给背景增加涟漪效果。

•何时使用: 在 Android 上,几乎所有可触摸的元素都可以使用。