React-Native 빠르게 시작하기 (2)

[레이아웃 나누기]

 

리액트 네이티브에서는 화면을 구성할 때, flex를 이용한다

(해당 레이아웃의 가중치를 부여한다고 생각)

 

App.js

최상위 View안에 노랑, 파랑 배경을 가진 View들을 배치

---

 

styles객체 구현 (flex는 해당 뷰가 얼만큼의 가중치를 가지는지 결정. 높을 수록 많은 영역)

안드로이드의 layout_weight속성과 일치한다

---

 

실행 결과 1:1의 비율로 나누어지는 것을 볼 수 있다