Иной

Высота и тени

Объекты в материальном дизайне обладают аналогичными качествами для объектов в физическом мире.
В физическом мире объекты могут быть сложены или прикреплены друг к другу, но не могут проходить друг через друга. Объекты также отбрасывают тени и отражают свет.

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

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

В то время как компоненты имеют постоянные высоты покоя в приложениях, у них могут быть различные уровни покоя на разных платформах и устройствах.

Динамические смещения возвышения - это цель, по которой компонент перемещается в сторону относительно своего состояния покоя.

Некоторые типы компонентов имеют отзывчивую высоту, то есть они меняют высоту в ответ на ввод пользователя (например, нормальный, сфокусированный и нажатый) или системные события. Эти изменения высоты последовательно реализуются с использованием динамических смещений высоты.

Высота покоя компонента

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

Высота покоя для настольных компьютеров на 2dp ниже перечисленных значений, чтобы приспособиться к средам с мышью и без нее. Телевизор и настольный компьютер имеют большую глубину, чем мобильные.

Высота объекта дочернего объекта зависит от высоты родительского объекта.
Высота измеряется на расстоянии от вершины одной поверхности до вершины другой.
24px - диалог, сборщик.


16px - Ящик Навигации, Правый ящик, Модальный нижний лист.


12px - Кнопка плавающего действия (FAB - нажата).


9px - Подменю (+ 1px для каждого подменю).


8px - Нижняя панель навигации, Меню, Карта (при получении), Поднятая кнопка (нажатое состояние).


6px - Кнопка плавающего действия (отметка покоя), Снэк-бар.


4px - Панель приложений.


3px - Индикатор обновления, Быстрый ввод / панель поиска (прокрученное состояние).


2px - Карточка (высота покоя), Поднятая кнопка (высота покоя), Быстрый ввод / панель поиска (отметка покоя).


1px - Переключатель.


Все материальные элементы имеют возвышенности.
Мобильная подписка ИЗИ ИВИ:
промокод easytad на 30 дней бесплатно
+ продление за 99 руб.