11. [Drawer] Custom Component side drawer를 customize 하는 방법에 대해서 알아보자! CustomDrawerContent를 대체하는 SideDrawer를 만들어보자 sideDrawer를 만든 뒤에 스타일까지 지정하면 스크린 간 이동을 하도록 설정을 추가로 해줘야 한다. 이건 onPress를 해서 이동하는 함수를 사용해주면 된다. 이동하는 함수는 새로 만들어 준다. navigateToScreen = (route) => () => { this.props.navigation.dispatch( CommonActions.navigate({ name: route, params: {}, }), ); }; route 는 화면 이동을 위해서 파라미터로 받아온 것인데 여기서 arro..

10. [Drawer] Style 설정 side drawer의 스타일을 설정하는 방법에 대해 알아보자! Stack Screen을 다룰 때는 각 스크린별로 스타일을 주기 위해서 Stack.Screen 태그 안에 options라는 프로퍼티를 사용했었고 여러 스크린에 공통으로 적용되는 스타일의 경우 Stack.Navigator 태그 안에 ScreenOptions라는 프로퍼티를 사용했다. Drawer Navigator의 경우는 side drawer를 정의된 모든 스크린에서 열 수 있다. 즉, 공통으로 사용되는 부분이기 때문에 스타일도 공통으로 적용될 거고 Drawer.Navigator 태그 안에 스타일을 설정한다. drawerType: 'front' - 뒤에 있는 화면은 고정된 채 side drawer가 화면을..

9. [Drawer] 설치 및 화면 Linking 수많은 에러를 맞이했지만 이를 해결한 과정은 이전의 error/solution 4번에 정리해뒀다. 2022.01.05 - [React Native/Basic] - [React Native] error/solution home_drawer.js /** * Sample React Native App * https://github.com/facebook/react-native * * @format * @flow strict-local */ import React, {Component} from 'react'; import {StyleSheet, Text, View, Button} from 'react-native'; class DrawerHomeScreen e..