728x90
반응형
Demensions
이건 해당 기기의 픽셀수를 직접 가져와서 대응하는것이다.
그래서 이걸 사용하여서 반응형으로 만들수가 있다.
이것의 사용법은 아래와 같다.
일단 import 를 해와야 한다.
import { Button, View, Text,Image,TouchableOpacity,ScrollView, StyleSheet,SafeAreaView, Dimensions } from 'react-native';
그렇게 하고 나면 이제 Dimensions를 쓸수가 있다.
사용법은 아래와 같다.
Dimensions.get('window').height/3
이건 height를 사용한건데 width를 사용하고 싶음 width를 적으면 된다.
/3 을 하게 되면 기기 화면에서의 30%된다.
※get()의 매개변수로 들어 가는 값에 따라서 크기가 달라짐
아이폰 같은 경우는 전체 화면으로 screen이나 window나 같지만
안드로이드 같은 경우는
'window' 일 경우
배터리가 표시되는 부분을 제외한 부분에서 시작이고
'screen' 일 경우는
화면 전체를 뜻한다
그렇담 height : '30%' 로 적는거랑 Dimensions.get('window') 랑 뭔 차이가 있는걸까
height : '30%' 를 하는것은 부모의 크기에서 30% 를 뜻하는것이고
Dimensios를 사용하는건 기기에서의 화면에서 크기를 구하는것이기 때문에 다르다.
반응형
'코딩일기 > React-Native' 카테고리의 다른 글
[ReactNative 공부] ScrollView child layout height 적용 (0) | 2021.05.18 |
---|---|
[ReactNative 공부] SafeAreaView 란 (0) | 2021.05.18 |
[ReactNative 공부] ScrollView와 Flatlist (0) | 2021.05.18 |
[React 기초] Props란 (0) | 2021.05.12 |
[React 기초] State 란? (0) | 2021.05.12 |