只要在組件外面包一個(gè)Touchable組件就可以實(shí)現(xiàn)點(diǎn)擊交互
一蚀苛、高亮觸摸 TouchableHighlight
當(dāng)點(diǎn)擊時(shí)在验,組件的透明度會(huì)改變,可以看到點(diǎn)擊效果堵未,TouchableHighlight只可以進(jìn)行嵌套一層腋舌。 其常用屬性如下:
activeOpacity 點(diǎn)擊時(shí),組件的透明度渗蟹。 0-1
onHideUnderlay 當(dāng)?shù)讓颖浑[藏時(shí)調(diào)用
onShowUnderlay 當(dāng)?shù)讓语@示時(shí)調(diào)用
style 風(fēng)格
underlayColor 當(dāng)點(diǎn)擊組件時(shí)顯示的顏色
<TouchableHighlight
underlayColor='#E1F6FF'
onPress = {()=>this.activeEvent('點(diǎn)擊')}
// onPressIn = {()=>this.activeEvent('按下')}
// onPressOut = {()=>this.activeEvent('抬起')}
// onLongPress = {()=>this.activeEvent("長按")}>
<Text>點(diǎn)擊</Text>
</TouchableHighlight>
二块饺、不透明觸摸 TouchableOpacity
activeOpacity 點(diǎn)擊時(shí),組件的透明度雌芽。 0-1
<TouchableOpacity activeOpacity={0.5}
onPress = {()=>this.activeEvent('點(diǎn)擊')}
// onPressIn = {()=>this.activeEvent('按下')}
// onPressOut = {()=>this.activeEvent('抬起')}
// onLongPress = {()=>this.activeEvent("長按")}>
<Text>點(diǎn)擊</Text>
</TouchableOpacity>
三授艰、不反饋觸摸,不會(huì)出現(xiàn)任何視覺變化 TouchableWithoutFeedback
<TouchableWithoutFeedback
onPress = {()=>this.activeEvent('點(diǎn)擊')}
// onPressIn = {()=>this.activeEvent('按下')}
// onPressOut = {()=>this.activeEvent('抬起')}
// onLongPress = {()=>this.activeEvent("長按")}>
<Text>點(diǎn)擊</Text>
</TouchableWithoutFeedback>