TouchableHighlight

我们建议使用Pressable组件，它更具扩展性且会是官方未来力推的主流。

本组件用于封装视图，使其可以正确响应触摸操作。当按下的时候，封装的视图的不透明度会降低，同时会有一个底层的颜色透过而被用户看到，使得视图变暗或变亮。

在底层实现上，实际会创建一个新的视图到视图层级中，如果使用的方法不正确，有时候会导致一些不希望出现的视觉效果。譬如没有给视图的 backgroundColor 显式声明一个不透明的颜色。

注意TouchableHighlight只支持一个子节点（不能没有子节点也不能多于一个）。如果你希望包含多个子组件，可以用一个 View 来包装它们。

function MyComponent(props: MyComponentProps) {
  return (
    <View {...props} style={{flex: 1, backgroundColor: '#fff'}}>
      <Text>My Component</Text>
    </View>
  );
}

<TouchableHighlight
  activeOpacity={0.6}
  underlayColor="#DDDDDD"
  onPress={() => alert('Pressed!')}>
  <MyComponent />
</TouchableHighlight>;

示例

---

文档

Props

TouchableWithoutFeedback Props

继承所有的 TouchableWithoutFeedback Props.

---

activeOpacity

指定封装的视图在被触摸操作激活时以多少不透明度显示（0 到 1 之间，默认值为 0.85）。需要设置underlayColor。

类型
number

---

onHideUnderlay

底层的颜色被隐藏的时候调用。

类型
function

---

onShowUnderlay

当底层的颜色被显示的时候调用。

类型
function

---

style

类型
View.style

---

underlayColor

有触摸操作时显示出来的底层的颜色。

类型
color

---

hasTVPreferredFocus

iOS

(Apple TV 专用) 是否允许在 Apple TV 上获取焦点。(请参考 View 组件的文档).

类型
bool

---

nextFocusDown

Android

TV 平台上向下选择焦点 (请参考 View 组件的文档).

类型
number

---

nextFocusForward

Android

TV 平台上向前选择焦点 (请参考 View 组件的文档).

类型
number

---

nextFocusLeft

Android

TV 平台上向左选择焦点 (请参考 View 组件的文档).

类型
number

---

nextFocusRight

Android

TV 平台上向右选择焦点 (请参考 View 组件的文档).

类型
number

---

nextFocusUp

Android

TV 平台上向上选择焦点 (请参考 View 组件的文档).

类型
number

---

testOnly_pressed

用于做快照测试。

类型
bool