<View>의 경우 기본적으로 display: flex; 가 적용됐다고 생각하면된다.
|브라우저의 경우 flex-direction: row; 인 반면 RN에서는 flexDirection: column임
import { View } from "react-native";
export default function App() {
return (
<View style={{ flex: 1 }}>
<View style={{ flex: 1, backgroundColor: "tomato" }}></View>
<View style={{ flex: 3, backgroundColor: "teal" }}></View>
<View style={{ flex: 1, backgroundColor: "orange" }}></View>
</View>
);
}
크기조정을 width: 100px; height: 200px;식으로 조정하지 않고 flex: 숫자 같이 정의해서 사용
'React Native' 카테고리의 다른 글
NFC를 태그하고 페이지를 이동하는 법 (1) | 2022.04.12 |
---|---|
Page 이동할때는 역시 react-navigation (0) | 2022.04.11 |
ScrollView의 간지기능 (0) | 2022.04.06 |
지원하는 Component와 APIs가 적어서 만들 수가 없잖아!!!!! (0) | 2022.04.06 |
React Native 기본 사용법 (0) | 2022.04.06 |