React Navigation Docs시리즈에서는 React Navigation 공식 홈페이지(https://reactnavigation.org)에 있는 내용을 정리해 보고자 합니다. 자세한 내용은 링크를 참고해주세요.
[RN] React Navigation Docs(1) - navigate
[RN] React Navigation Docs(2) - params
아래에 보이는 화면이 Drawer Navigator 입니다. 감이 확 오시나요?
DrawerNavigator
DrawerNavigator(RouteConfigs, DrawerNavigatorConfig)
다음은 DrawerNavigatorConfig 의 옵션들입니다. DrawerNavigator는 Navigation의 로직을 수정하기 위한 옵션 뿐 아니라, 드로어의 위치, 폭, 애니메이션 등의 옵션들도 설정할 수 있습니다.
drandWidth - 드로어의 폭
drawerPosition - 왼쪽 또는 오른쪽을 설정하는 옵션. 디폴트는 왼쪽 위치.
contentComponent - DrawerItems와 같은 드로어의 내용을 렌더링하는 데 사용되는 구성 요소. 드로어에 대한 props를 받을 수 있다. 디폴트는 DrawerItems.
useNativeAnimations - 기본 애니메이션을 사용할 수 있다. 디폴트는 true.
drawerBackgroundColor - 드로어의 배경 색상. 디폴트는 흰색입니다.
initialRouteName - 초기 경로에 대한 routeName.
order - drawer item 들의 순서를 정의.
path - routeName의 매핑을 path config 로 제공.
backBehavior - 뒤로가기 버튼을 눌렀을 때, 드로어가 초기 경로로 전활될지의 여부. 'initialRoute'인 경우 스위치의 초기 경로로 돌아간다. 'none' 으로 설정하면, 전 route로 가거나 전 route가 없을 시 앱이 종료된다. 디폴트는 none.
[RN] React Navigation Docs(1) - navigate
[RN] React Navigation Docs(2) - params
'프론트-엔드 > 리액트-네이티브(ReactNative)' 카테고리의 다른 글
[RN] React Navigation Docs(7) - Tab Navigator (0) | 2019.01.31 |
---|---|
[RN] React Navigation Docs(5) - Switch Navigator (0) | 2019.01.31 |
[RN] React Navigation Docs(4) - App containers (0) | 2019.01.31 |
[RN] React Navigation Docs(3) - navigationOptions (0) | 2019.01.31 |
[RN] React Navigation Docs(2) - params (1) | 2019.01.31 |