개발새발 개발개발

10-1 개요padding과 margin은 레이아웃을 할 때 공백을 어느정도 줄껀지를 설정하는 함수이다.여백을 너무 많이주거나 적게 주게되면 App의 디자인에 문제가 생긴다.적절한 여백을 통해서 깔끔한 App 디자인을 만들어야 되는데 이 때 중요한 요소가 바로 padding과 margin이다. https://medium.com/frontendshortcut/margin-vs-padding-c1fc8ea8bfaf 10-2 Marginmargin은 부모컴포넌트나 같은 부모 컴포넌트 안에 있는 자식들과의 여백을 지정하는데 사용한다. —Exampleimport React from 'react'; import {Text, View, StyleSheet, SafeAreaView} from 'react-native'..

9-1 Layout DirectionLayout Directiondms 계층 구조에서 자식요소와 텍스트가 배치되어야 하는 방향을 지정한다.레이아웃의 방향은 양끝을 나타내는 start와 end를 통해 나타내는데 기본적으로 React Native는 LTR 레이아웃 방향으로 되어있다. LTR 모드에서는 start는 왼쪽 끝을 의미하고 end는 오른쪽 끝을 의미한다. LTR(default) : 텍스트와 자식 요소들이 왼쪽에서 오른쪽으로 배치된다. margin과 padding 속성도 왼쪽에 적용이 된다.RTL : 텍스트와 자식 요소들이 오른쪽에서 왼쪽으로 배치된다. margin과 padding 속성도 오른쪽에서 왼쪽으로 적용이 된다. 9-2 justifyContent자식 컴포넌트를 부모 컴포넌트 flexDirec..

8-1 개요 없는 App이 없는 오늘날 같은 시대에서는 디자인이 정말 중요하다. 같은 기능을 하는 App이 2개가 있다면 소비자는 디자인, 효율성, 부가기능들을 따져서 둘중에 하나를 선택할 것이다.React-native를 시작할 때 디자인 쪽을 공부하고 진행을 하면 더욱 빠르게 습득이 가능할 것 같아서 가장 먼저 디자인의 레이아웃 부분을 다룰 것이다. 8-2 Flexflex는 크기를 비율로 설정하는 것이다. —Example1import React from 'react'; import {Text, View, StyleSheet} from 'react-native'; const App = () => { return ( ) } const styles = StyleSheet.create({ container: ..