반응형
특징
1. 컴포넌트 영역 터치시 OnPress 이벤트 속성에 설정된 콜백 함수를 호출한다.
2. 단 한개 자식 컴포넌트만 온다.
Button, TouchableOpacity, TouchableHiglight 차이
Button : 커스텀에 제약 사항이 많고 일부 안드로이드 낮은 버전에서는
디자인 적용 안되는 경우도 있음.
TouchableOpacity : 컴포넌트 바탕색 투명도 변화가 생김
모든 플랫폼 디자인에 이상 없이 동작
TouchableHiglight: 컴포넌트 바탕색 잠깐 바뀜
return(
<SafeAreaView>
// button
<Button title="btn" onPress={}/>
// touchahbleOpacity
<TouchableOpacity onPress={}>
<Text>TouchableOpacity</Text>
</TouchableOpacity>
// touchahbleHighlight
<TouchableHighlight onPress={}>
<Text>TouchableHighlight</Text>
</TouchableHighlight>
</SafeAreaView>
)
모두 OnPress 이벤트 속성을 가지고 있음
번외로 Text 컴포넌트도 OnPress 이벤트 속성을 가지고 있음
다만 터치시 아무런 변화가 없다는게 Button, TouchableOpacity, TouchableHiglight
다르다
return(
<SafeAreaView>
// button
<Text onPress={}>text</Text>
</SafeAreaView>
)
728x90
'모바일 APP > React-Native' 카테고리의 다른 글
재사용 컴포넌트 (reusable components) (0) | 2021.09.15 |
---|---|
인라인 스타일과 StyleSheet 스타일 차이 (0) | 2021.09.14 |
React-Native 특징 (0) | 2021.09.08 |
null 병합 연산자 (Nullish Coalescing Operator) (0) | 2021.09.08 |
선택적 연결 (Optional Chaining) (0) | 2021.09.08 |