Rozpoczynanie aktywności przy użyciu animacji

Przejścia aktywności w aplikacjach w stylu Material Design zapewniają wizualne łączenie różnych stanów w postaci ruchu i przekształceń między typowymi elementami. Możesz określić niestandardowe animacje dla przejść wejścia i wyjścia oraz przejścia elementów wspólnych między działaniami.

Rysunek 1. Przejście ze wspólnymi elementami.

• Przejście Enter określa sposób, w jaki widoki pojawiają się w ramach aktywności. Na przykład w przejściu wejścia explode widoki pojawiają się od zewnątrz i wlatają do środka na środek ekranu.
• Przejście wyjścia określa sposób, w jaki widoki w aktywności opuszczają scenę. Na przykład w punkcie przejścia explode widok jest poza środkiem.
• Przejście elementów wspólnych określa sposób, w jaki widoki danych udostępniane między 2 działaniami przechodzą między tymi działaniami. Jeśli np. 2 działania zawierają ten sam obraz w różnych położeniach i rozmiarach, przejście wspólnego elementu changeImageTransform płynnie przekształca i skaluje obraz między tymi aktywnościami.

Android obsługuje te przejścia między wprowadzaniem i wyjściem:

• explode: zwiększa widok do środka lub od środka sceny.
• slide: przenosi widoki do lub z jednego z krańców sceny.
• fade: dodaje lub usuwa widok z sceny przez zmianę jego przezroczystości.

Każde przejście rozszerzające klasę Visibility jest obsługiwane jako przejście wejścia lub wyjścia. Więcej informacji znajdziesz w dokumentacji interfejsu API klasy Transition.

Android obsługuje też te przejścia wspólnych elementów:

• changeBounds: animuje zmiany w granicach układu widoków docelowych.
• changeClipBounds: animuje zmiany granic przycięcia w widokach docelowych.
• changeTransform: animuje zmiany skali i rotacji widoków docelowych.
• changeImageTransform: animuje zmiany rozmiaru i skali obrazów docelowych.

Gdy włączysz w aplikacji przenoszenie aktywności, domyślne przejście pomiędzy aktywnościami rozpoczęcia i wyjścia jest aktywne.

Rysunek 2. Przejście sceny z 1 udostępnionym elementem.

Przykładowy kod animowany między działaniami przy użyciu wspólnych elementów znajdziesz w sekcji ActivitySceneTransition Basic.

Sprawdzanie wersji systemu

Interfejsy API związane z przenoszeniem aktywności są dostępne na urządzeniach z Androidem 5.0 (API 21) i nowszym. Aby zachować zgodność z wcześniejszymi wersjami Androida, sprawdź system version w czasie działania, zanim wywołasz interfejsy API dla którejś z tych funkcji:

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
}

Określanie niestandardowych operacji przejścia

Po pierwsze, włącz przejścia zawartości okna za pomocą atrybutu android:windowActivityTransitions, gdy definiujesz styl dziedziczony z motywu materiałowego. W definicji stylu możesz też określić przejścia między elementami wspólnymi (Enter, Wyjście) i Udostępnione:

<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>

Przejście change_image_transform jest w tym przykładzie zdefiniowane tak:

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

Element changeImageTransform odpowiada klasie ChangeImageTransform. Więcej informacji znajdziesz w dokumentacji interfejsu API Transition.

Aby zamiast tego włączyć w kodzie przenoszenie treści okien, wywołaj funkcję 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());

Aby określić przejścia w kodzie, wywołaj te funkcje za pomocą obiektu Transition:

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

Funkcje setExitTransition() i setSharedElementExitTransition() określają przejście wyjścia dla działania wywołującego. Funkcje setEnterTransition() i setSharedElementEnterTransition() określają przejście do wprowadzania wywołanej aktywności.

Aby w pełni uzyskać efekt przejścia, musisz włączyć przenoszenie treści okien zarówno dla wywołań, jak i wywoływanych działań. W przeciwnym razie działanie wywołujące rozpocznie przejście wyjścia, ale potem zobaczysz przejścia, takie jak skala lub zanikanie.

Aby jak najszybciej rozpocząć przejście wejścia, użyj funkcji Window.setAllowEnterTransitionOverlap() w wywołanej aktywności. Pozwala to na bardziej dramatyczne przejście.

Rozpoczynanie aktywności z użyciem przejść

Jeśli włączysz przejścia i ustawisz przejście wyjścia dla danej aktywności, przejście aktywuje się po uruchomieniu innego działania w ten sposób:

Kotlin

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

Java

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

Jeśli ustawisz przejście wejściowe dla drugiej aktywności, zostanie ono również aktywowane wraz z rozpoczęciem aktywności. Aby wyłączyć przenoszenie podczas rozpoczynania innego działania, udostępnij pakiet opcji null.

Rozpocznij aktywność z udostępnionym elementem

Aby utworzyć animację przejścia ekranu między 2 działaniami, które mają wspólny element:

1. Włącz w motywie przejścia zawartości okna.
2. Określ przejście elementów wspólnych w swoim stylu.
3. Zdefiniuj przejście jako zasób XML.
4. Za pomocą atrybutu android:transitionName przypisz wspólne nazwy do wspólnych elementów w obu układach.
5. Użyj funkcji 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());
    }
});

W przypadku udostępnionych widoków dynamicznych generowanych w kodzie użyj funkcji View.setTransitionName(), aby w obu aktywnościach określić wspólną nazwę elementu.

Aby odwrócić animację przejścia sceny po zakończeniu drugiego działania, wywołaj funkcję Activity.finishAfterTransition() zamiast Activity.finish().

Rozpocznij aktywność z wieloma udostępnianymi elementami

Aby utworzyć animację przejścia między scenami między 2 działaniami, które mają więcej niż 1 element wspólny, zdefiniuj wspólne elementy w obu układach za pomocą atrybutu android:transitionName lub użyj funkcji View.setTransitionName() w obu działaniach i utwórz obiekt ActivityOptions w ten sposób:

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"));