Анимация при переходе к объекту activity

Попробуйте Compose

Jetpack Compose – это рекомендуемый набор инструментов для создания пользовательского интерфейса в Android. Узнайте, как работать с анимацией в Compose.

Анимация между разными типами контента в Compose →

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

Рис. 1. Переход с общими элементами.

• Переход enter определяет, как представления в действии появляются на экране. Например, при переходе explode представления появляются за пределами сцены и перемещаются к центру экрана.
• Переход выхода определяет, как представления в действии покидают сцену. Например, при переходе explode представления покидают сцену, удаляясь от центра.
• Переход общих элементов определяет, как представления, которые являются общими для двух действий, переходят между этими действиями. Например, если в двух действиях есть одно и то же изображение, но оно расположено в разных местах и имеет разные размеры, то переход changeImageTransform плавно перемещает и масштабирует изображение между этими действиями.

Android поддерживает следующие переходы:

• explode – приближает или отдаляет камеру от центра сцены.
• slide – перемещает представления внутрь или наружу от одного из краев сцены.
• fade – добавляет или удаляет представление из сцены, изменяя его непрозрачность.

Любой переход, расширяющий класс Visibility, поддерживается как переход входа или выхода. Дополнительную информацию можно найти в документации по API для класса Transition.

Android also supports these shared elements transitions:

• changeBounds – анимирует изменения границ макета целевых представлений.
• changeClipBounds: анимирует изменения границ обрезки целевых представлений.
• changeTransform – анимирует изменения масштаба и поворота целевых представлений.
• changeImageTransform – анимирует изменения размера и масштаба целевых изображений.

Если вы включите переходы между действиями в приложении, то по умолчанию будет использоваться перекрестное затухание.

Рисунок 2. Переход между сценами с одним общим элементом.

Пример кода, который анимирует переходы между действиями с помощью общих элементов, см. в разделе ActivitySceneTransitionBasic.

Проверьте версию системы

API переходов между действиями доступны в Android 5.0 (API 21) и более поздних версиях. Чтобы сохранить совместимость с более ранними версиями Android, проверяйте системную функцию version во время выполнения, прежде чем вызывать API для любой из следующих функций:

Kotlin

// Check if we're running on Android 5.0 or higher
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    // Apply activity transition
} else {
    // Swap without transition
}

Java

// Check if we're running on Android 5.0 or higher
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    // Apply activity transition
} else {
    // Swap without transition
}

Как задать собственные переходы

Сначала включите переходы между контентом окон с помощью атрибута android:windowActivityTransitions, когда определяете стиль, наследуемый от тематического оформления Material Design. Вы также можете указать переходы для входа, выхода и общих элементов в определении стиля:

<style name="BaseAppTheme" parent="android:Theme.Material">
  <!-- enable window content transitions -->
  <item name="android:windowActivityTransitions">true</item>

  <!-- specify enter and exit transitions -->
  <item name="android:windowEnterTransition">@transition/explode</item>
  <item name="android:windowExitTransition">@transition/explode</item>

  <!-- specify shared element transitions -->
  <item name="android:windowSharedElementEnterTransition">
    @transition/change_image_transform</item>
  <item name="android:windowSharedElementExitTransition">
    @transition/change_image_transform</item>
</style>

Переход change_image_transform в этом примере определяется следующим образом:

<!-- res/transition/change_image_transform.xml -->
<!-- (see also Shared Transitions below) -->
<transitionSet xmlns:android="http://schemas.android.com/apk/res/android">
  <changeImageTransform/>
</transitionSet>

Элемент changeImageTransform соответствует классу ChangeImageTransform. Дополнительную информацию можно найти в документации по API для Transition.

Чтобы включить переходы между контентом окон в коде, вызовите функцию Window.requestFeature():

Kotlin

// Inside your activity (if you did not enable transitions in your theme)
with(window) {
    requestFeature(Window.FEATURE_ACTIVITY_TRANSITIONS)

    // Set an exit transition
    exitTransition = Explode()
}

Java

// Inside your activity (if you did not enable transitions in your theme)
getWindow().requestFeature(Window.FEATURE_ACTIVITY_TRANSITIONS);

// Set an exit transition
getWindow().setExitTransition(new Explode());

Чтобы задать переходы в коде, вызовите эти функции с объектом Transition:

• Window.setEnterTransition()
• Window.setExitTransition()
• Window.setSharedElementEnterTransition()
• Window.setSharedElementExitTransition()

Функции setExitTransition() и setSharedElementExitTransition() определяют переход для вызывающего объекта activity. Функции setEnterTransition() и setSharedElementEnterTransition() определяют переход входа для вызываемого действия.

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

Чтобы начать переход как можно скорее, используйте функцию Window.setAllowEnterTransitionOverlap() в вызываемом действии. Это позволяет создавать более эффектные переходы.

Как начать занятие с помощью переходов

Если вы включите переходы и зададите переход при выходе для действия, он будет активироваться при запуске другого действия следующим образом:

Kotlin

startActivity(intent,
              ActivityOptions.makeSceneTransitionAnimation(this).toBundle())

Java

startActivity(intent,
              ActivityOptions.makeSceneTransitionAnimation(this).toBundle());

Если вы зададите переход для входа во второе действие, он также будет активироваться при запуске действия. Чтобы отключить переходы при запуске другого действия, укажите набор параметров null.

Как запустить действие с общим элементом

Примечание. Информацию о переходах между composable-функциями с согласованным контентом можно найти в статье Переходы между общими элементами в Compose.

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

1. Включите переходы между контентом в окне в своей теме.
2. Укажите переход общих элементов в стиле.
3. Определите переход как XML-ресурс.
4. Присвойте общее имя общим элементам в обоих макетах с помощью атрибута android:transitionName.
5. Используйте функцию ActivityOptions.makeSceneTransitionAnimation().

Kotlin

// Get the element that receives the click event
val imgContainerView = findViewById<View>(R.id.img_container)

// Get the common element for the transition in this activity
val androidRobotView = findViewById<View>(R.id.image_small)

// Define a click listener
imgContainerView.setOnClickListener( {
    val intent = Intent(this, Activity2::class.java)
    // Create the transition animation - the images in the layouts
    // of both activities are defined with android:transitionName="robot"
    val options = ActivityOptions
            .makeSceneTransitionAnimation(this, androidRobotView, "robot")
    // Start the new activity
    startActivity(intent, options.toBundle())
})

Java

// Get the element that receives the click event
final View imgContainerView = findViewById(R.id.img_container);

// Get the common element for the transition in this activity
final View androidRobotView = findViewById(R.id.image_small);

// Define a click listener
imgContainerView.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        Intent intent = new Intent(this, Activity2.class);
        // Create the transition animation - the images in the layouts
        // of both activities are defined with android:transitionName="robot"
        ActivityOptions options = ActivityOptions
            .makeSceneTransitionAnimation(this, androidRobotView, "robot");
        // Start the new activity
        startActivity(intent, options.toBundle());
    }
});

Для общих динамических просмотров, которые вы генерируете в коде, используйте функцию View.setTransitionName(), чтобы указать общее название элемента в обоих действиях.

Чтобы воспроизвести анимацию перехода в обратном порядке, когда вы завершаете второе действие, вызовите функцию Activity.finishAfterTransition() вместо Activity.finish().

Как начать сеанс с несколькими общими элементами

Чтобы создать анимацию перехода между двумя действиями, у которых есть несколько общих элементов, определите общие элементы в обоих макетах с помощью атрибута android:transitionName или используйте функцию View.setTransitionName() в обоих действиях и создайте объект ActivityOptions следующим образом:

Kotlin

// Rename the Pair class from the Android framework to avoid a name clash
import android.util.Pair as UtilPair
...
val options = ActivityOptions.makeSceneTransitionAnimation(this,
        UtilPair.create(view1, "agreedName1"),
        UtilPair.create(view2, "agreedName2"))

Java

ActivityOptions options = ActivityOptions.makeSceneTransitionAnimation(this,
        Pair.create(view1, "agreedName1"),
        Pair.create(view2, "agreedName2"));