지니 코딩일기

react-navigation ver.6 에서 다음 방법으로 구할 수 있다. import { useHeaderHeight } from '@react-navigation/elements'; // ... const headerHeight = useHeaderHeight();

요약 로딩바 공식 문서 https://reactnative.dev/docs/activityindicator ActivityIndicator · React Native Displays a circular loading indicator. reactnative.dev 예시 HTML 삽입 미리보기할 수 없는 소스

요약 iOS에서 노치, 화면 테두리(radius)에 의해 가려지는 부분에 자동으로 padding을 주어 가려짐을 방지한다 공식 문서 https://reactnative.dev/docs/safeareaview SafeAreaView · React Native The purpose of SafeAreaView is to render content within the safe area boundaries of a device. It is currently only applicable to iOS devices with iOS version 11 or later. reactnative.dev 예시 HTML 삽입 미리보기할 수 없는 소스

요약 TextInput(키보드 입력창) 클릭 시 키보드가 올라올 때 화면이 자동으로 위로 올라갈 수 있도록 하는 역할 공식 문서 https://reactnative.dev/docs/keyboardavoidingview KeyboardAvoidingView · React Native It is a component to solve the common problem of views that need to move out of the way of the virtual keyboard. It can automatically adjust either its height, position, or bottom padding based on the keyboard height. reactnative.dev 예시 HTM..

요약 아무 반응 없이 클릭하기! (클릭 시 아무 반응 없음) 공식 문서 https://reactnative.dev/docs/touchablewithoutfeedback TouchableWithoutFeedback · React Native If you're looking for a more extensive and future-proof way to handle touch-based input, check out the Pressable API. reactnative.dev 예시 HTML 삽입 미리보기할 수 없는 소스

요약 리스트 생성 data에 데이터를 넣으면 renderItem 형태로 된 item의 리스트를 만들어줌 *section 구분이 필요하다면 사용! 설명 아래 사항들을 모두 지원함 Fully cross-platform. Optional horizontal mode. Configurable viewability callbacks. Header support. Footer support. Separator support. Pull to Refresh. Scroll loading. ScrollToIndex support. Multiple column support. 공식 문서 https://reactnative.dev/docs/flatlist FlatList · React Native A performant in..