useWindowDimensions
jsx
import { useWindowDimensions } from 'react-native';
useWindowDimensions
会在屏幕尺寸变化时自动更新获取到的设备width
和height
值。使用方法如下:
jsx
const windowWidth = useWindowDimensions().width;
const windowHeight = useWindowDimensions().height;
示例
- The useDimensions hook from the community React native hooks library aims to make handling screen/window size changes easier to work with.
- React Native Responsive Dimensions also comes with responsive hooks.
属性
fontScale
The scale of the font currently used. Some operating systems allow users to scale their font sizes larger or smaller for reading comfort. This property will let you know what is in effect.
jsx
useWindowDimensions().fontScale;
height
The height in pixels of the window or screen your app occupies.
jsx
useWindowDimensions().height;
scale
The pixel ratio of the device your app is running on.
jsx
useWindowDimensions().scale;
A value of
1
indicates PPI/DPI of 96 (76 on some platforms).2
indicates a Retina or high DPI display.
width
The width in pixels of the window or screen your app occupies.
jsx
useWindowDimensions().width;