<ScrollView contentContainerStyle={{width: "100%"}}>
스크롤 뷰 스타일은
contentContainerStyle
로 적용한다. 팀원과 같이 강의를 보면서 메모했는데 막상 UI를 그릴 땐 왜 생각이 안나..?
<ScrollView style={}>
당연히 render
에러가 떴고, 아 스크롤뷰에서는 스타일 적용이 안되나보다~ 하고있었다;;
<SafeAreaView>
제일 최상위에 해당 컴포넌트를 적용해두면, 노치 밑으로 화면 레이아웃 UI를 적용시킬 수 있음.
<Button> 에는 무조건 title prop이 있어야 한다.
Ex) <Button title=“저장“/>
onClick
대신onPress
로 사용
<Image>를 붙히려면, import 해줘야 한다.
import { Image, StyleSheet, Text, View } from “react-native”;
인라인스타일에
fontSize: 30
⬅️ 단위 생략 가능, 대신 문자열로 쓰면 안됨
require
메서드 : 이미지를 불러 올 때 사용<Image source={require("./assets/favicon.png")} style={{ width: 100, height: 100 }} />
📌 emotion 라이브러리 사용
npm install @emotion/react @emotion/native
yarn add @emotion/react @emotion/native
StyleSheet.create() : 리액트 네이티브에서 쓰는 문법으로 자동완성 제공해줌const styles = StyleSheet.create({ alignBox: { alignItems: "center", justifyContent: "center", },