ReactNative_StyleSheet 이용한 스타일링

React Native에서의 스타일링

• CSS가 아닌 JavaScript로 스타일링 함
• 모든 Core Components 가 Style이라는 prop을 가지고 있음

React Native 스타일링 방법

• inline styles

<Text styles={{marginBottom: 35}}>ToDo App</Text>

• Style Sheet 객체
  - 스타일링 코드를 분리해줘서 전체 소스 코드의 가독성이 좋음
  - StyleSheet를 사용하면 이미 정해놓은 스타일을 캐시 해주기 때문에
  - 리렌더링할 때 inline styles를 사용할 때 보다 성능이 좋게 됨

<Text styles={styles.pageTitle}>ToDo App</Text>

const styles = StyleSheet.create({
	pageTitle: {
    	marginBottom: 35,
    },
});