Как анимировать переходы между пунктами назначения

Компонент Navigation позволяет добавлять к действиям анимацию как свойств, так и представлений. Чтобы создать собственную анимацию, ознакомьтесь с ресурсами по анимации.

В Navigation также есть несколько анимаций по умолчанию. Чтобы добавить анимацию к действию, выполните следующие действия:

  1. В редакторе навигации нажмите на действие, в котором должна происходить анимация.
  2. В разделе Анимация на панели Атрибуты нажмите на стрелку раскрывающегося списка рядом с нужной анимацией. Доступны следующие типы:
    • Ввод пункта назначения
    • Выход из пункта назначения
    • Переход к пункту назначения с помощью действия извлечения, которое извлекает дополнительные пункты назначения из обратного стека во время навигации.
    • Выход из пункта назначения с помощью действия pop
  3. Выберите анимацию из списка.
раздел анимации на панели атрибутов
Рисунок 1. Раздел Анимация на панели Атрибуты.

Добавив анимацию, перейдите на вкладку Текст, чтобы открыть XML-код. XML-код анимации появится в соответствующем элементе <action>. В примере ниже specifyAmountFragment – это исходный целевой объект для действия confirmationAction.

<fragment
    android:id="@+id/specifyAmountFragment"
    android:name="com.example.buybuddy.buybuddy.SpecifyAmountFragment"
    android:label="fragment_specify_amount"
    tools:layout="@layout/fragment_specify_amount">
    <action
        android:id="@+id/confirmationAction"
        app:destination="@id/confirmationFragment"
        app:enterAnim="@anim/slide_in_right"
        app:exitAnim="@anim/slide_out_left"
        app:popEnterAnim="@anim/slide_in_left"
        app:popExitAnim="@anim/slide_out_right" />
</fragment>

Добавьте переходы между общими элементами

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

Общие элементы предоставляются программно, а не через XML-файл навигации. У каждого пункта назначения Activity и фрагментов есть подкласс интерфейса Navigator.Extras, который принимает дополнительные параметры Navigation, включая общие элементы. Вы можете передать эти Extras при вызове navigate().

Переходы общих элементов к целевому фрагменту

Класс FragmentNavigator.Extras позволяет сопоставлять общие элементы из одного пункта назначения со следующим по имени перехода, аналогично использованию FragmentTransaction.addSharedElement(). Затем вы можете передать дополнительные параметры в navigate(), как показано в примере ниже.

Kotlin

val extras = FragmentNavigatorExtras(view1 to "hero_image")

view.findNavController().navigate(
    R.id.confirmationAction,
    null, // Bundle of args
    null, // NavOptions
    extras)

Java

FragmentNavigator.Extras extras = new FragmentNavigator.Extras.Builder()
    .addSharedElement(view1, "hero_image")
    .build();

Navigation.findNavController(view).navigate(
    R.id.details,
    null, // Bundle of args
    null, // NavOptions
    extras);

Переходы общих элементов к целевому объекту действия

Для управления переходами общих элементов в действиях используется ActivityOptionsCompat, как описано в документации Начало действия с общим элементом и показано в примере ниже.

Kotlin

// Rename the Pair class from the Android framework to avoid a name clash
import android.util.Pair as UtilPair
...
val options = ActivityOptionsCompat.makeSceneTransitionAnimation(activity,
        UtilPair.create(view1, "hero_image"))
val extras = ActivityNavigatorExtras(options)
view.findNavController().navigate(
    R.id.details,
    null, // Bundle of args
    null, // NavOptions
    extras)

Java

ActivityOptions options = ActivityOptions.makeSceneTransitionAnimation(this,
        Pair.create(view1, "hero_image"));

ActivityNavigatorExtras extras = new ActivityNavigatorExtras.Builder()
    .setActivityOptions(options)
    .build();


Navigation.findNavController(view).navigate(
    R.id.details,
    null, // Bundle of args
    null, // NavOptions
    extras);

Применять анимацию всплывающих окон к переходам между действиями

При переходе к Activity или от него анимация всплывающих окон не применяется автоматически. Вместо этого нужно вызвать ActivityNavigator.applyPopAnimationsToPendingTransition() из целевого пункта назначения Activity, где должна произойти анимация:

Kotlin

override fun finish() {
    super.finish()
    ActivityNavigator.applyPopAnimationsToPendingTransition(this)
}

Java

@Override
public void finish() {
    super.finish();
    ActivityNavigator.applyPopAnimationsToPendingTransition(this);
}