Навигационная панель Android¶

Навигационная панель Android — элемент интерфейса операционной системы Android, размещаемый в нижней части экрана и обеспечивающий переход между основными разделами приложения или системными функциями. С момента выхода Android 3.0 (Honeycomb, 2011) Google рекомендует использовать нижнюю область экрана для основной навигации, а с Android 5.0 (Lollipop, 2014) и позднее — компонент Navigation Bar и библиотеку Jetpack Navigation.

¶Системная навигация Android

¶Три кнопки (Legacy Navigation)

До Android 9.0 Pie стандартом была трёхкнопочная навигация: «Назад» (Back), «Домой» (Home) и «Обзор» (Overview/Recents). Кнопки отображались в системной навигационной панели внизу экрана и управлялись самой ОС. Разработчики приложений не могли заменить эти кнопки собственными, но могли скрывать системную панель через API immersive mode, если интерфейс требовал полноэкранного режима.

¶Жесты (Gesture Navigation)

Начиная с Android 10, по умолчанию используется навигация жестами: свайп от нижнего края — «Домой», свайп с задержкой — «Обзор», свайп от левого или правого края — «Назад». Пользователь может переключиться обратно на трёхкнопочный режим в настройках устройства («Система» → «Навигация жестами»). Производители прошивок (MIUI, One UI, ColorOS и другие) часто добавляют собственные варианты, например «Кнопки навигации» с настраиваемым порядком.

¶Нижняя навигация в приложениях

¶Bottom Navigation View

Компонент BottomNavigationView из библиотеки Material Components — основной способ реализовать нижнюю панель с кнопками внутри приложения. Он отображает от 3 до 5 пунктов меню с иконками и подписями. Поддерживает переключение фрагментов, выделение активного пункта и анимации.

Пример разметки:

``xml <com.google.android.material.bottomnavigation.BottomNavigationView android:id="@+id/bottom_nav" android:layout_width="match_parent" android:layout_height="wrap_content" app:menu="@menu/bottom_nav_menu" app:labelVisibilityMode="labeled" /> ``

Меню определяется в отдельном XML-файле:

``xml <menu> <item android:id="@+id/nav_home" android:icon="@drawable/ic_home" android:title="Главная" /> <item android:id="@+id/nav_search" android:icon="@drawable/ic_search" android:title="Поиск" /> <item android:id="@+id/nav_profile" android:icon="@drawable/ic_person" android:title="Профиль" /> </menu> ``

Обработчик переключений в Kotlin:

``kotlin binding.bottomNav.setOnItemSelectedListener { item -> val fragment = when (item.itemId) { R.id.nav_home -> HomeFragment() R.id.nav_search -> SearchFragment() R.id.nav_profile -> ProfileFragment() else -> return@setOnItemSelectedListener false } supportFragmentManager.beginTransaction() .replace(R.id.container, fragment) .commit() true } ``

¶Navigation Bar в Jetpack Navigation

Компонент NavigationBarView в связке с NavController и NavGraph позволяет декларативно описывать граф переходов. Меню автоматически синхронизируется с текущим фрагментом, поддерживается обратная навигация и сохранение состояния.

``kotlin val navController = findNavController(R.id.nav_host_fragment) binding.bottomNav.setupWithNavController(navController) ``

¶BottomAppBar и FloatingActionButton

Для более сложных сценариев Material Design предлагает BottomAppBar — панель с расширенными возможностями: встроенный FloatingActionButton, меню-гамбургер, тулбар-поведение при прокрутке. Панель может «уезжать» вниз при прокрутке списка и возвращаться обратно.

¶Кастомная реализация

При необходимости полностью контролировать внешний вид разработчики создают собственную панель из LinearLayout или ConstraintLayout, размещённого внизу экрана:

```xml <LinearLayout android:layout_width="match_parent" android:layout_height="56dp" android:orientation="horizontal" android:background="@color/white" app:layout_constraintBottom_toBottomOf="parent">

<ImageButton android:id="@+id/btn_back" android:layout_width="0dp" android:layout_weight="1" android:layout_height="match_parent" android:src="@drawable/ic_back" android:background="?attr/selectableItemBackground" />

<ImageButton android:id="@+id/btn_home" android:layout_width="0dp" android:layout_weight="1" android:layout_height="match_parent" android:src="@drawable/ic_home" /> </LinearLayout> ```

Для корректного размещения над системной навигационной панелью используется WindowInsetsCompat:

``kotlin ViewCompat.setOnApplyWindowInsetsListener(binding.root) { view, insets -> val bars = insets.getInsets(WindowInsetsCompat.Type.systemBars()) view.setPadding(0, 0, 0, bars.bottom) insets } ``

¶Особенности и рекомендации

• Material Design рекомендует не более 5 пунктов в нижней панели; при 3–4 пунктах подписи всегда видны, при 5 — могут скрываться.
• Размер каждой кнопки должен быть не менее 48dp по высоте для удобства нажатия (accessibility-рекомендации Google).
• Активный пункт выделяется цветом colorPrimary и/или изменением иконки (filled/outlined вариант).
• На планшетах и в раскладке с двумя панелями (two-pane) нижняя навигация обычно заменяется боковым меню (NavigationDrawer или NavigationRail).
• Для приложений с единственным экраном нижняя панель не нужна — вместо неё используются кнопки действий внутри экрана.

¶История изменений