Skip to main content

useWindowDimensions

tsx
import {useWindowDimensions} from 'react-native';

useWindowDimensions는 화면 크기나 폰트 스케일이 변경될 때마다 자동으로 값을 업데이트한다. 애플리케이션 윈도우의 너비와 높이를 다음과 같이 가져올 수 있다:

tsx
const {height, width} = useWindowDimensions();

예제​

속성​

fontScale​

tsx
useWindowDimensions().fontScale;

현재 사용 중인 글꼴의 크기 비율을 나타낸다. 일부 운영체제는 사용자가 읽기 편하도록 글꼴 크기를 조절할 수 있게 허용한다. 이 속성을 통해 현재 적용된 글꼴 크기 비율을 확인할 수 있다.

height​

tsx
useWindowDimensions().height;

앱이 차지하는 윈도우 또는 화면의 높이를 픽셀 단위로 나타낸다.

scale​

tsx
useWindowDimensions().scale;

앱이 실행 중인 기기의 픽셀 비율을 나타낸다. 이 값은 다음과 같을 수 있다:

  • 1: 한 포인트가 한 픽셀과 동일함을 의미한다. (일반적으로 PPI/DPI가 96이며, 일부 플랫폼에서는 76)
  • 2 또는 3: 레티나 디스플레이나 고해상도 디스플레이를 나타낸다.

width​

tsx
useWindowDimensions().width;

여러분의 앱이 차지하는 윈도우 또는 화면의 너비를 픽셀 단위로 나타낸다.