Hola, Amigos! На связи Владимир Зевеке и Михаил Чернецов, Flutter-devs Amiga. Сегодня обсудим MediaQuery — важный инструмент для адаптивной верстки.

MediaQuery — это класс, устанавливающие поддерево, в котором для заданных данных разрешаются медиа-запросы. Самое популярное его свойство — size, к которому часто обращаются через MediaQuery.of(context).size.

Однако, это не оптимально. Рекомендуется использовать MediaQuery.sizeOf(context). Разница в том, что функция of() заставляет виджет перестраиваться при изменении любого свойства MediaQuery, тогда как sizeOf() этого не делает, что повышает производительность. То же самое относится и к другим свойствам MediaQuery.

Несмотря на удобство MediaQuery, им не рекомендуется злоупотреблять в коде, поскольку в определённых случаях поведение данного инструмента может стать труднопредсказуемым. Его можно использовать, если:

🔴 Приложение должно адаптировать дизайн под разные размеры экрана.
🔴 Виджету требуется динамическая ширина (width).
🔴 Задачу нельзя решить другим инструментом адаптивной верстки, например, Flexible.

MediaQuery также предоставляет информацию об экране устройства: viewInsets и viewPadding. viewInsets полезен для определения, открыта ли клавиатура. viewPadding дает информацию о небезопасной зоне устройства.

Ещё одна фишка — использование textScaler для адаптивной верстки, это полезно если размеры какого-то виджета должны увеличиваться при увеличении размера текста. Например, виджет фиксированной высоты или размер иконок в кнопках.

Кроме того, MediaQuery позволяет узнать находится ли устройство в режиме «темной темы», используя поле platformBrightness и ориентацию устройства (ландшафтный или портретный режим).

Делитесь своими вопросами и опытом в чате!