본문 바로가기
코딩일기/React-Native

[ReactNative 공부] Demensions 사용

by 욱파이어니어 2021. 5. 18.
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를 사용하는건 기기에서의 화면에서 크기를 구하는것이기 때문에 다르다.

 

 

반응형