Memulai aktivitas menggunakan animasi

Transisi aktivitas pada aplikasi desain material memberikan koneksi visual di antara berbagai status melalui motion dan transformasi antar-elemen umum. Anda dapat menetapkan animasi kustom untuk transisi masuk dan keluar, serta untuk transisi elemen bersama antar-aktivitas.

• Transisi masuk menentukan cara tampilan dalam aktivitas memasuki scene. Misalnya, pada transisi masuk explode, tampilan akan masuk ke scene dari luar dan terbang ke tengah layar.
• Transisi keluar menentukan cara tampilan dalam aktivitas keluar dari scene. Misalnya, pada transisi keluar explode, tampilan akan keluar dari scene menjauh dari tengah layar.
• Transisi elemen bersama menentukan cara tampilan ditampilkan di antara dua transisi aktivitas antara aktivitas tersebut. Misalnya, jika dua aktivitas memiliki gambar yang sama dengan posisi dan ukuran berbeda, transisi elemen bersama changeImageTransform akan menerjemahkan dan menskalakan gambar dengan lancar di antara aktivitas tersebut.

Android mendukung transisi masuk dan keluar ini:

• explode - Memindahkan tampilan masuk atau keluar dari tengah scene.
• slide - Memindahkan tampilan masuk atau keluar dari salah satu tepi scene.
• fade - Menambahkan atau menghapus tampilan dari scene dengan mengubah opasitasnya.

Transisi apa pun yang memperluas class Visibility didukung sebagai transisi masuk atau transisi keluar. Untuk informasi selengkapnya, lihat referensi API untuk class Transition.

Android juga mendukung transisi elemen bersama berikut:

• changeBounds - Menganimasikan perubahan pada batas tata letak tampilan target.
• changeClipBounds - Menganimasikan perubahan pada batas klip tampilan target.
• changeTransform - Menganimasikan perubahan pada skala dan rotasi tampilan target.
• changeImageTransform - Menganimasikan perubahan pada ukuran dan skala gambar target.

Jika mengaktifkan transisi aktivitas dalam aplikasi, transisi cross-fading default akan diaktifkan di antara aktivitas masuk dan aktivitas keluar.

Gambar 2 - Transisi scene dengan satu elemen bersama.

Untuk kode contoh yang memberi animasi antar-aktivitas menggunakan elemen bersama, lihat ActivitySceneTransitionBasic.

Memeriksa versi sistem

Activity transition API tersedia di Android 5.0 (API 21) dan yang lebih baru. Guna mempertahankan kompatibilitas dengan versi Android sebelumnya, periksa version sistem pada saat waktu proses sebelum memanggil API untuk salah satu fitur berikut:

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

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

Menetapkan transisi custom

Pertama, aktifkan transisi konten jendela dengan atribut android:windowActivityTransitions jika Anda mendefinisikan gaya yang mewarisi tema material. Anda juga dapat menentukan transisi masuk dan keluar, serta elemen bersama pada definisi gaya:

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

Transisi change_image_transform dalam contoh ini didefinisikan sebagai berikut:

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

Elemen changeImageTransform sesuai dengan class ChangeImageTransform. Untuk informasi selengkapnya, lihat referensi API untuk Transition.

Sebaiknya, untuk mengaktifkan transisi konten jendela dalam kode Anda, panggil fungsi Window.requestFeature():

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

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

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

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

Untuk menentukan transisi dalam kode Anda, panggil fungsi ini dengan objek Transition:

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

Fungsi setExitTransition() dan setSharedElementExitTransition() menentukan transisi keluar untuk aktivitas memanggil. Fungsi setEnterTransition() dan setSharedElementEnterTransition() menentukan transisi masuk untuk aktivitas yang menerima panggilan.

Untuk mendapatkan efek penuh transisi, Anda harus mengaktifkan transisi konten jendela pada aktivitas memanggil maupun aktivitas yang dipanggil. Jika tidak, aktivitas memanggil akan memulai transisi keluar, tetapi kemudian Anda akan melihat transisi jendela (seperti mengelupas atau memudar).

Untuk memulai transisi masuk secepatnya, gunakan fungsi Window.setAllowEnterTransitionOverlap() pada aktivitas yang dipanggil. Ini memungkinkan Anda mendapatkan transisi masuk yang lebih dramatis.

Memulai aktivitas dengan menggunakan transisi

Jika mengaktifkan transisi dan menyetel transisi keluar untuk suatu aktivitas, transisi tersebut akan diaktifkan saat Anda meluncurkan aktivitas lain sebagai berikut:

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

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

Jika transisi masuk untuk aktivitas kedua sudah disetel, transisi ini juga akan diaktifkan saat aktivitas dimulai. Untuk menonaktifkan transisi saat Anda memulai aktivitas lain, sediakan paket opsi null.

Memulai aktivitas dengan satu elemen bersama

Untuk membuat animasi transisi layar di antara dua aktivitas yang memiliki satu elemen bersama:

1. Aktifkan transisi konten jendela dalam tema Anda.
2. Tetapkan transisi elemen bersama dalam gaya Anda.
3. Tentukan transisi Anda sebagai resource XML.
4. Tetapkan nama umum pada elemen bersama dalam kedua layout dengan atribut android:transitionName.
5. Gunakan fungsi ActivityOptions.makeSceneTransitionAnimation().

    // 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())
    })
    

    // 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());
        }
    });
    

Untuk tampilan dinamis bersama yang Anda hasilkan dalam kode, gunakan fungsi View.setTransitionName() untuk menentukan nama elemen yang sama di kedua aktivitas.

Untuk membalik animasi transisi scene saat Anda menyelesaikan aktivitas kedua, panggil fungsi Activity.finishAfterTransition() bukan Activity.finish().

Memulai aktivitas dengan beberapa elemen bersama

Untuk membuat animasi transisi scene antara dua aktivitas yang memiliki lebih dari satu elemen bersama, tentukan elemen bersama dalam kedua tata letak dengan atribut android:transitionName (atau gunakan fungsi View.setTransitionName() dalam kedua aktivitas), dan buat objek ActivityOptions sebagai berikut:

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

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