YumeHANA YUME'S DEV

메뉴를 구성하기 위해 Drawer Navigator를 사용 https://reactnavigation.org/docs/drawer-navigator Drawer Navigator | React NavigationDrawer Navigator renders a navigation drawer on the side of the screen which can be opened and closed via gestures.reactnavigation.org Navigation docs에서 expo기준으로 진행Setup두개를 설치npm install @react-navigation/drawernpx expo install react-native-gesture-handler react-native-reanimate..

버튼을 누르면 페이지 이동을 하기 위해 naviagation을 사용 Setupnatvigation을 사용하기 위해 react-navigation과 stack 사용npm install @react-navigation/nativenpm install @react-navigation/stack Useageapp.tsx 파일에서 네비게이션을 설정 NavigationContiner르 페이지를 이동할 영역을 잡아주며Stack.Navigator를 사용하여 어느 페이지로 이동할것인지 경로를 잡아준다. Stat.Navigator initalRouteName="Home"으로 설정하여 초기 화면은 Home으로 나오도록 하며,Home에서 버튼을 누르면 QR 스캔을 하는 컴포넌트로 이동하도록 구현 처음에 Stack.Navig..

react에서 svg 아이콘 사용  해당 gitHub를 참고하여 사용https://github.com/kristerkari/react-native-svg-transformer GitHub - kristerkari/react-native-svg-transformer: Import SVG files in your React Native project the same way that you would inImport SVG files in your React Native project the same way that you would in a Web application. - kristerkari/react-native-svg-transformergithub.com 우선 사용할 svg 파일을 다운https:/..

Expo camera를 활용하여 QR 코드 인식하기Expo 에서 BarcodeScanner를 사용할려고했는데 오류가 발생하면서 실행이 안되어서 Camera를 사용해서 기능을 구현 https://docs.expo.dev/versions/latest/sdk/camera/ CameraA React component that renders a preview for the device's front or back camera.docs.expo.devExpo Camera Setup우선 Expo-camera를 설치npx expo install expo-camera 앱을 사용할때 사용자의 카메라 혹은 오디오의 권한을 요청하기 위해 플러그인을 추가app.json 파일에 plugins를 추가{ "expo": { "..