Непрокручиваемые макеты ориентированы на удобную для восприятия информацию и предлагают пользователям ценную информацию при минимальном взаимодействии или вообще без него. В связи с этим встроить адаптивное поведение в такие макеты может быть сложно.
Предустановленные компоненты макета без прокрутки
Диалог
Диалог — это временное наложение, занимающее весь экран. Оно позволяет пользователям выполнить одно действие.
- Диалоги фокусируют ваше внимание, чтобы убедиться, что их содержание учтено.
- Диалоги должны напрямую сообщать информацию и быть направлены на выполнение задачи.
- Диалоги должны появляться в ответ на задачу или действие пользователя и содержать соответствующую или контекстную информацию.
Подтверждение наложения
Подтверждающее сообщение отображается на экране в течение короткого времени. Используйте этот компонент, чтобы привлечь внимание пользователя после выполнения действия.
Открыть на телефоне
Наложение «Открыть на телефоне» активируется, когда пользователь решает продолжить просмотр на телефоне. Наложение имеет индикатор хода выполнения и подсказывает пользователю, когда следует проверить телефон.
Степпер
Степперы обеспечивают полноэкранное управление, позволяя пользователям выбирать из ряда значений. Взаимодействие осуществляется с помощью кнопок или заводной головки, а нужный уровень отображается с помощью изогнутого индикатора.
Выбор времени
Пикеры позволяют пользователям выбирать из ограниченного числа элементов в прокручиваемых секциях. Пикер времени может содержать до трёх столбцов, в зависимости от наличия секунд и формата времени (12-часовой или 24-часовой). Пользователи взаимодействуют с каждым столбцом по отдельности, делая выбор, оставляя число в фокусе перед продолжением.
Выбор даты
Элементы выбора позволяют пользователям выбирать из ограниченного числа элементов в прокручиваемых секциях. В элементе выбора даты может быть до трёх столбцов, которые могут быть расположены в порядке, зависящем от варианта использования: дата, время и год. Для элементов выбора даты требуются более длинные строки контента, поэтому в каждый момент времени отображается только один столбец, что даёт представление о том, что находится слева или справа. Пользователи взаимодействуют с каждым столбцом по отдельности, делая выбор, оставляя число в фокусе перед продолжением.
Примеры пользовательских макетов без прокрутки
Экраны приложений без прокрутки не ограничены набором компонентов. Вы можете комбинировать элементы, чтобы создать желаемый макет.
Следует учитывать ограниченное пространство на экране без прокрутки и использовать адаптивные (процентные) поля и отступы для оптимального использования доступного пространства. Также можно рассмотреть возможность применения контрольной точки на уровне 225 dp для добавления дополнительного контента или повышения удобства просмотра существующего контента на экранах большего размера.
Карты
Аварийное наложение
Экстренное оповещение
Реактивное и адаптивное поведение
Все компоненты библиотеки Compose автоматически адаптируются к более широкому экрану и увеличиваются в ширину и высоту. В таких представлениях использование точек останова может обеспечить особенно насыщенный и полезный опыт для всех пользователей.
Для многих кнопок, карточек и полей вашего пользовательского интерфейса растяните и заполните пространство для разных размеров экрана, чтобы использовать все доступное пространство в пользовательском интерфейсе, а также создать сбалансированную компоновку.
Используйте следующий контрольный список для проверки того, что адаптивные параметры определены правильно:
- Создавайте гибкие макеты, которые будут выглядеть разумно на экранах всех размеров.
- Примените рекомендуемые верхние, нижние и боковые поля.
- Определите поля в процентных значениях в тех местах, где в противном случае содержимое может быть обрезано.
- Используйте ограничения макета, чтобы элементы максимально эффективно использовали пространство на экране и поддерживали баланс на устройствах разных размеров.
- Если используется текст времени , разместите его так, чтобы он не перекрывал верхнюю часть страницы.
- Подумайте об использовании прилегающих к краям кнопок, чтобы более эффективно использовать ограниченное пространство.
- Рассмотрите возможность применения контрольной точки на уровне 225dp, чтобы представить дополнительный контент или сделать существующий контент более удобным для просмотра на экранах большего размера.
Множественные перемещения по страницам без прокрутки с использованием пагинации
В сценариях, когда требуется больше контента, но хочется сохранить макет без прокрутки, рассмотрите многостраничный макет с вертикальной или горизонтальной навигацией по страницам.
