React & React Native

TouchableOpacity

클라인STR 2018. 10. 18. 21:14

TouchableOpacity View가 터치에 적절하게 응답하도록하는 래퍼이다. 

아래로 누르면 래핑된 뷰의 불트명도가 감소하여 흐리게 표시된다.


render() {
let opacity = this.props.disabled ? 1 : 0.5;
return (
<TouchableOpacity
activeOpacity={opacity}
onPress={this.props.onPress}
style={[styles.wideButton, this.props.style]}
>
{this.props.children}
</TouchableOpacity>
);
}



  • activeOpacity : 터치가 활성화 되었을때 래핑된 뷰의 불투명도 값 (Default 0,2)
  • tvParallaxProperties : Apple Tv 시차 효과를 제어한다. (Only Apple TV)
  • hasTVPreferredFocus : Tv 우선 포커스 설정 (Only Apple TV)
출처 : https://facebook.github.io/react-native/docs/touchableopacity#activeopacity