Строка состояния, строка заголовка и панель навигации – это системные строки. На них отображается важная информация, например уровень заряда батареи, время и сигналы уведомлений, и они обеспечивают прямое взаимодействие с устройством из любого места.
Всегда учитывайте наличие и расположение системных строк, когда разрабатываете макеты, способы ввода или другие функции устройства.
Навыки работы с Android
Посмотреть на GitHubДобавьте поддержку режима "От края до края"
android skills add edge-to-edge
Выводы
Добавьте системные строки в макеты для разных размеров экрана и форм-факторов. Учитывайте безопасные зоны интерфейса, системные взаимодействия, способы ввода, вырезы на экране, строки состояния, заголовки, панели навигации и другие возможности устройства.
Сделайте системные строки состояния и панели навигации прозрачными или полупрозрачными и отрисовывайте контент за ними, чтобы он занимал весь экран.
Используйте
WindowInsets, чтобы правильно обрабатывать вторжения системной строки и следить за тем, чтобы контент не был скрыт в адаптивных макетах.Используйте канонические макеты, которые позволяют эффективно использовать пространство экрана.
Строка состояния
В строке состояния находятся значки уведомлений и системные значки. Пользователь взаимодействует со строкой состояния, потянув её вниз, чтобы получить доступ к панели уведомлений. Строка состояния может быть прозрачной или полупрозрачной.
Значки строки состояния
Значки в строке состояния могут выглядеть по-разному в зависимости от контекста, времени суток, настроек пользователя, темы и других параметров. Подробнее о значках в системной строке…
Когда приходит уведомление, в строке состояния обычно появляется значок. Это указывает пользователю, что в панели уведомлений есть что-то, что нужно посмотреть. Это может быть значок приложения или символ, представляющий канал. Подробнее о дизайне уведомлений…
Как настроить стиль строки состояния
Сделайте строку состояния прозрачной или полупрозрачной, чтобы контент приложения занимал весь экран. Затем настройте стиль значков системной строки, чтобы они были достаточно контрастными.
В Android 15 принудительно включено отображение от края до края, поэтому строка состояния по умолчанию прозрачная. Чтобы обеспечить обратную совместимость, вызовите метод enableEdgeToEdge().
На изображении слева строка состояния прозрачная, а зеленый фон TopAppBar отрисовывается за ней.
Прозрачные строки состояния идеально подходят, когда под ними не отображается интерфейс или изображение. Полупрозрачные строки состояния идеально подходят, когда пользовательский интерфейс прокручивается под строкой состояния. Подробнее о защите градиента…
Навигация
В Android пользователи могут управлять навигацией с помощью кнопок "Назад", "Главный экран" и "Обзор".
- "Назад" – вернуться к предыдущему представлению.
- "Главный экран" – переход из приложения на главный экран устройства.
- В режиме обзора показаны активные приложения и недавно закрытые приложения.
Пользователи могут выбрать различные конфигурации навигации, включая навигацию жестами и адаптивную навигацию. Чтобы обеспечить оптимальный пользовательский опыт, учитывайте несколько типов навигации.
Навигация с помощью жестов
При навигации жестами не используются кнопки "Назад", "Главный экран" и "Обзор". Вместо них показывается один маркер жеста. Чтобы вернуться назад, пользователи проводят пальцем от левого или правого края экрана, а чтобы перейти на главный экран – снизу вверх. Проведите вверх и удерживайте палец, чтобы открыть обзор.
Навигация жестами – это более масштабируемый шаблон навигации для проектирования на мобильных и больших экранах. Чтобы обеспечить максимальное удобство для пользователей, учитывайте навигацию жестами, выполняя следующие действия:
- Поддержка контента во весь экран.
- Не добавляйте интерактивные элементы или области прикосновения под вставками навигации жестами.
Подробнее о том, как добавить поддержку навигации жестами…
Адаптивная навигация
Ещё один распространенный шаблон навигации в Android – переключение между панелью навигации и панелью навигации в зависимости от класса размера окна дисплея. Компоненты адаптивной навигации в Jetpack Compose поддерживают разные типы устройств и не позволяют системным строкам мешать макету компонентов навигации.
При использовании адаптивных макетов учитывайте, как системные строки могут вести себя или выглядеть в разных контекстах, например при компактном или расширенном размере окна или в разных положениях складного устройства.
Подробнее о том, как создать адаптивную навигацию…
Значки навигации
Значки навигации также могут выглядеть по-разному в зависимости от настроек или тем, заданных пользователем. Подробнее о значках в системной строке…
Как настроить стиль навигации
Android обеспечивает визуальную защиту пользовательского интерфейса в режиме навигации жестами и в кнопочных режимах. Система применяет динамическую адаптацию цвета, при которой содержимое системных строк меняет цвет в зависимости от того, что находится за ними.
Режим навигации жестами
После того как вы настроите таргетинг на Android 15 или вызовете метод enableEdgeToEdge для Activity, система отрисует прозрачную панель навигации жестами и применит динамическую адаптацию цвета. В примере ниже маркер на панели навигации становится темным, если он расположен над светлым контентом, и наоборот.
Рекомендуем всегда использовать прозрачные панели навигации жестами.
Что следует делать
Чего делать нельзя
Режимы кнопок
После того как вы настроите таргетинг на Android 15 или вызовете enableEdgeToEdge в Activity, система применит полупрозрачную сетку за панелями навигации с кнопками. Ее можно удалить, установив для Window.setNavigationBarContrastEnforced() значение false.
Используйте прозрачные панели навигации с тремя кнопками, если внизу есть панель приложения или панель навигации приложения, а также если интерфейс не прокручивается под панелью навигации с тремя кнопками. Чтобы сделать панель навигации прозрачной, задайте для Window.setNavigationBarContrastEnforced() значение false и добавьте отступы в нижние панели приложения, чтобы они отрисовывались под системными панелями навигации, как показано на рисунках 7, 8 и 9. Подробнее о защите системной строки…
Используйте полупрозрачную панель навигации с тремя кнопками для прокрутки контента. Подробнее о полупрозрачной панели навигации…
Клавиатура и навигация
Каждый тип навигации реагирует на экранную клавиатуру, позволяя пользователю выполнять такие действия, как закрытие или даже изменение типа клавиатуры. Чтобы обеспечить плавный переход, синхронизирующий переход приложения с клавиатурой, скользящей вверх и вниз от нижней части экрана, используйте WindowInsetsAnimationCompat.
Макеты
Адаптивные макеты оптимизируют доступное пространство для показа. Они организуют интерфейс приложения, перемещая контент на дополнительные панели.
При разработке адаптивных макетов учитывайте, как системные строки взаимодействуют с вашим контентом. Используйте WindowInsets, чтобы системные строки не перекрывали интерфейс на больших экранах, складных устройствах, а также в многооконном режиме и режиме рабочего стола.
Если приложение отображается во весь экран, убедитесь, что контент и элементы управления не перекрываются системным интерфейсом. Например, если панель навигации закрывает кнопку, пользователь не сможет нажать на нее.
Дополнительную информацию можно найти в статье Канонические макеты.
Вырезы на экране
Вырез на экране – это область, которая заходит на экран и позволяет разместить фронтальные датчики. Вырезы на экране могут различаться в зависимости от производителя. Учитывайте, как вырезы на экране будут взаимодействовать с контентом, ориентацией и полноэкранным режимом.
Режим комфортного просмотра
Системные строки можно скрыть, когда нужен полноэкранный режим, например при просмотре фильма. Пользователь должен иметь возможность нажать на экран, чтобы открыть системные строки и взаимодействовать с элементами управления. Дополнительную информацию можно найти в статьях Иммерсивный контент и Как скрыть системные строки в режиме погружения.