ReactNative - 스크린 크기 구하기 (Dimensions)

1. 서론

이미지 관련 개발 중 사용중인 기기의 스크린 기준으로 width, height를 설정하고자 하였다.

React Natvie 문서에서 제공해주는 API를 사용하면 스크린의 크기를 구할 수 있다.

import {Dimensions} from 'react-native';

다음과 같이 사용하면 된다.

const windowWidth = Dimensions.get('window').width;
const windowHeight = Dimensions.get('window').height;

2. window, screen 차이점

window vs screen

window	screen
어플리케이션에서 보여주는 화면의 크기	기기의 화면 크기
노란색 부분 제외	노란색 부분 포함

참고

https://reactnative.dev/docs/dimensions