고지은고

1. 시뮬레이터 인풋 창을 눌렀음에도 키보드가 나타나지 않는 경우 시뮬레이터 활성화 상태에서 위에 I/O > Keyboard > Toggle Software Keyboard를 클릭해주면 인풋 창을 다시 눌렀을 때, 키보드 입력이 활성화된다. 이렇게 키보드가 나타날 경우, 안드로이드에선 자동으로 화면이 줄어들지만 IOS는 화면을 그대로 다 가려버린다 react-native의 KeyboardAvoidingView를 이용하여 키보드가 올라올 때 IOS 화면을 가리지 않도록 할 수 있다 2. IOS 키보드가 화면을 가리는 경우 (키보드 활성화 시 화면 줄어들게 하기) import {KeyboardAvoidingView, Platform} from 'react-native'; ... const styles = S..

1. ReactNative 컴포넌트 컴포넌트는 '구성 요소'라는 의미를 갖고 있다. 즉, UI를 구성하는 요소라고 이해하면 된다. 리액트의 경우, 여러 컴포넌트로 쪼갠 뒤 그 컴포넌트를 이어 붙이면서 작업하는데 이는 리액트 네이티브에서도 마찬가지다. import React from 'react'; import {SafeAreaView, StyleSheet, View, Text} from 'react-native'; function App() { return ( React Native! ); }; const styles = StyleSheet.create({ // 스타일 지정 방법 block: { flex: 1, //flex 1을 설정해주면 위치한 곳의 모든 영역을 차지 } )} export default..

새로운 RN 프로젝트 생성 npx react-native init npx는 Node.js와 함께 설치되며, node 환경에서 구동되는 CLI 도구를 간단하게 사용할 수 있도록 도와준다. yarn android 또는 yarn ios를 터미널에 입력하여 각 환경에서 앱을 구동할 수 있다. yarn start는 Metro를 구동해준다. Metro란, 리액트 네이티브를 위한 자바스크립트 번들러로 js 파일을 읽어서 순서에 맞게 하나의 파일로 합쳐주고 앱에서 실행 준비를 해준다. 참고로 yarn android, yarn ios 스크립트를 입력하면 start 스크립트가 자동으로 시작되어 따로 입력하여 실행하는 일은 드물다. 1. 안드로이드 환경에서 리액트 네이티브 앱 구동 안드로이드 스튜디오에서 새로운 프로젝트 클..