728x90 반응형 React Native2 [React_Native] To Do 리스트 만들기 01 To Do List를 만들기 위해 프로젝트와 라이브러리가 설치되었다고 가정하고 시작해보자. 그전에 style을 보기편하게 정리하고 가보자. 우선 별도의 styles.js 파일을 만들어 주자. 그리고 다음과 같이 dimension을 정의하여 주자. import { Dimensions, StyleSheet } from "react-native"; Dimensions은 기기의 화면크기와 관련된 정보를 제공하는 모듈이고 별도의 설치 없이 import 하는것으로 사용가능하다. Dimesions을 별도로 정의하는 이유는 기기마다 화면의 크기가 다르기 때문에 개발시 협업을 할때 값의 차이가 발생할 수도 있고 사용자들마다 기기에 따라 위치가 다르게 표기될 수 있기 때문에 통일시켜주는것이 중요하다. export cons.. 2024. 2. 1. [React Native] 기본적이지만 필수적인 Styles 정리. react native에서 css를 직접적으로 사용할 수는 없지만 css와 비슷한 방식으로 style이 적용된다 스타일 속성은 자바스크립트 오브젝트로 나타낼 수 있으며, 배열을 전달할 수 있다. 가장 마지막에 나열한 스타일이 우선 순위를 가지게 된다. inline으로 스타일을 객체로 넣는 방법도 있지만 style코드가 길어지게 되면 코드를 정리하기도 힘들고 알아보기도 힘들기 때문에 위와 같이 별도의 Styles.js를 만들어서 여러 스타일을 한 곳에 정의하는 것이 더 깨끗하다. 또한 후의 apk빌드를 하였을때 기종마다 규격이 다르기 때문에 이와 같이 규격을 미리 정해놓고 style을 정의한다면 통일감을 줄 수 있고 코드를 관리하기에도 수월하다. 그렇다면 기본적이지만 필수적인 React native의 .. 2023. 12. 5. 이전 1 다음 728x90 반응형