Размеры

useWindowDimensions — предпочтительный API для React-компонентов. В отличие от Dimensions, он обновляется при изменении размеров окна. Это хорошо сочетается с парадигмой React.

import { Dimensions } from 'react-native';

Вы можете получить ширину и высоту окна приложения с помощью следующего кода:

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

Хотя размеры доступны сразу, они могут изменяться (например, из-за поворота устройства, складных устройств и т. д.). Поэтому любая логика отрисовки или стили, зависящие от этих констант, должны пытаться вызывать эту функцию при каждом рендере, а не кэшировать значение (например, использовать встроенные стили вместо установки значения в StyleSheet).

Если вы ориентируетесь на складные устройства или устройства, на которых может изменяться размер экрана или окна приложения, вы можете использовать обработчик событий, доступный в модуле Dimensions, как показано в примере ниже.

• Функциональный компонент
• Компонент класса

Справочник

Методы

addEventListener()

static addEventListener(type, handler)

Добавление обработчика событий. Поддерживаемые события:

• change: Срабатывает при изменении свойства в объекте Dimensions. Аргументом обработчика события является объект типа DimensionsValue.

get()

static get(dim)

Начальные размеры устанавливаются до вызова runApplication, поэтому они должны быть доступны до выполнения любых других require, но могут быть обновлены позже.

Пример: const {height, width} = Dimensions.get('window');

Параметры:

Для Android размер window не будет включать размер, используемый status bar (если он не полупрозрачный) и bottom navigation bar

removeEventListener()

static removeEventListener(type, handler)

Устарело. Используйте метод remove() на подписке на событие, возвращённой методом addEventListener().

set()

static set(dims)

Это должно вызываться только из нативного кода путём отправки события didUpdateDimensions.

Параметры:

Определения типов

DimensionsValue

Свойства:

DisplayMetrics

Свойства: