본문 바로가기
React Navtive

[RN]레이아웃,스타일

by hans-j 2023. 5. 21.

바로 본론으로 간다

자자 모든 Views는 기본적으로 Flex Container 이다.

 

그리고

 

웹 에서는 Flex Direction의 기본 속성은 Row지만!! 

 

모바일에서는 Flex Direction의 기본 속성이 Column이다.

 

 

레이아웃 속성을 정할 때 width, height을 사용하지 않는다.

이유는? 기기마다 스크린의 크기가 다르기때문에 바람직하지 않음.

 

React Native다운 레이아웃 설정을 하려면 Flex 속성을 이용해서 비율을 활용한다 ex)fex: 1

여기서 중요한것은! 부모 View태그에 flex:1을 주어야한다. 기준이 필요하니께

 

또 다른 예제 ㅋ

 


RN는 모든게 Component다.

 

따라서 스크롤을 내리고 싶을 때도 Scroll기능구현이 가능한 Component를 가져와야한다

 

React Native에서 ScrollView를 가져오자.

 

https://reactnative.dev/docs/scrollview

 

ScrollView · React Native

Component that wraps platform ScrollView while providing integration with touch locking "responder" system.

reactnative.dev

 

 

 

그렇다면 사용법은?

 

 

 

 

'React Navtive' 카테고리의 다른 글

[RN]컴포넌트,API 가져오기  (0) 2023.05.12
[RN]리액트 네이티브 시작하기  (0) 2023.05.11