Как настроить предпросмотр для жеста "Назад"

По умолчанию включены системные анимации и предпросмотр для жеста "Назад". Если ваше приложение перехватывает событие возврата и вы ещё не перешли на предпросмотр для жеста "Назад", обновите приложение, чтобы использовать поддерживаемые API обратной навигации.

Анимация предпросмотра для жеста "Назад" на главный экран.
Прогнозная анимация перехода между действиями.
Анимация для предпросмотра жеста "Назад".

Как включить системные анимации по умолчанию

Системные анимации возврата на главный экран, перехода между объектами activity и перехода между задачами доступны на устройствах с Android 15 и более поздних версий для приложений, которые перешли на поддерживаемые API для обработки жеста "Назад".

  • Назад на главный экран – возвращает пользователя на главный экран.
  • Переходы между объектами activity. Переходы между объектами activity в приложении.
  • Между задачами. Переходы между задачами.

Эти анимации включены по умолчанию в Android 15 и более поздних версиях. На устройствах с Android 13 или 14 пользователи могут включить их в режиме разработчика.

Чтобы получить системные анимации, обновите зависимость AndroidX Activity до версии 1.6.0 или более поздней.

Как включить предпросмотр для жеста "Назад" с помощью Navigation Compose

Чтобы использовать предпросмотр для жеста "Назад" в Navigation Compose, убедитесь, что вы используете библиотеку navigation-compose версии 2.8.0 или более поздней.

Navigation Compose автоматически выполняет плавный переход между экранами, когда пользователь проводит пальцем назад:

Рисунок 2. Анимация перехода по умолчанию в приложении SociaLite.

При переходе между слайдами можно использовать собственные переходы с помощью popEnterTransition и popExitTransition. При применении к NavHost эти модификаторы позволяют задать анимацию экранов входа и выхода. С их помощью можно создавать различные эффекты, например масштабирование, затухание или скольжение.

В этом примере scaleOut используется в popExitTransition, чтобы уменьшить размер экрана при переходе назад. Кроме того, параметр transformOrigin определяет точку, вокруг которой происходит анимация масштабирования. По умолчанию масштабирование выполняется относительно центра экрана (0.5f, 0.5f). Вы можете изменить это значение, чтобы масштабирование выполнялось относительно другой точки.

NavHost(
    navController = navController,
    startDestination = Home,
    popExitTransition = {
        scaleOut(
            targetScale = 0.9f,
            transformOrigin = TransformOrigin(pivotFractionX = 0.5f, pivotFractionY = 0.5f)
        )
    },
    popEnterTransition = {
        EnterTransition.None
    },
    modifier = modifier,
)

Этот код дает следующий результат:

Рисунок 3. Пользовательская анимация в приложении SociaLite.

popEnterTransition и popExitTransition управляют анимацией при возврате к предыдущему экрану, например с помощью жеста "Назад". Вы также можете использовать enterTransition и exitTransition, чтобы задать анимацию для входа и выхода composable-функций в целом, а не только для предпросмотра для жеста "Назад". Если вы задали только enterTransition и exitTransition, они будут использоваться как для обычной навигации, так и для возврата к предыдущему экрану. Однако с помощью popEnterTransition и popExitTransition можно создавать отдельные анимации для обратной навигации.

Как интегрировать переходы общих элементов

Переходы между общими элементами обеспечивают плавную визуальную связь между компонентами с общим контентом. Они часто используются для навигации.

Рисунок 4. Переход между общими элементами с предпросмотром для жеста "Назад" в Navigation Compose

Чтобы использовать общие элементы с Navigation Compose, ознакомьтесь с разделом Предпросмотр для жеста "Назад" с общими элементами.

Поддержка предпросмотра для жеста "Назад" с помощью компонентов Material Compose

Многие компоненты библиотеки Material Compose разработаны так, чтобы без проблем работать с жестами "Назад" с прогнозированием. Чтобы включить анимацию предпросмотра для жеста "Назад" в этих компонентах, добавьте в проект последнюю зависимость Material3 (androidx.compose.material3:material3-*:1.3.0 или более поздней версии).

Компоненты Material Design, поддерживающие анимации с предпросмотром для жеста "Назад":

SearchBar и ModalBottomSheet автоматически анимируются с помощью жестов "Назад" с предпросмотром. ModalNavigationDrawer, ModalDrawerSheet, DismissibleDrawerSheet и DismissibleNavigationDrawer требуют передавать drawerState в соответствующие композиции контента листа.

Как протестировать анимацию для жеста "Назад"

Если вы используете Android 13 или 14, вы можете протестировать анимацию возврата на главный экран.

Чтобы проверить эту анимацию, выполните следующие действия:

  1. На устройстве выберите Настройки > Система > Для разработчиков.
  2. Выберите Анимации с предпросмотром для жеста "Назад".
  3. Запустите обновленное приложение и выполните жест "Назад", чтобы увидеть, как работает предпросмотр.

На устройствах с Android 15 и более новыми версиями ОС эта функция включена по умолчанию.

Дополнительные ресурсы

Назад
Предпросмотр для жеста "Назад"
Далее
Как отслеживать прогресс вручную