Membuat animasi transisi kustom

Transisi khusus memungkinkan Anda membuat animasi yang tidak tersedia dari class transisi bawaan. Misalnya, Anda dapat menentukan transisi khusus yang mengubah warna latar depan teks dan bidang masukan menjadi abu-abu untuk menunjukkan bahwa bidang dinonaktifkan di layar baru. Jenis perubahan ini membantu pengguna melihat kolom yang Anda nonaktifkan.

Transisi khusus, seperti salah satu jenis transisi bawaan, menerapkan animasi ke tampilan anak dari adegan awal dan akhir. Namun, tidak seperti jenis transisi bawaan, Anda harus menyediakan kode yang mengambil nilai properti dan menghasilkan animasi. Anda mungkin juga ingin menentukan subset tampilan target untuk animasi Anda.

Halaman ini menjelaskan cara mengambil nilai properti dan membuat animasi untuk membuat dan membuat transisi kustom.

Memperluas class Transisi

Untuk membuat transisi kustom, tambahkan class ke project Anda yang memperluas class Transition dan ganti fungsi yang ditampilkan dalam cuplikan berikut:

class CustomTransition : Transition() {

    override fun captureStartValues(transitionValues: TransitionValues) {}

    override fun captureEndValues(transitionValues: TransitionValues) {}

    override fun createAnimator(
        sceneRoot: ViewGroup,
        startValues: TransitionValues?,
        endValues: TransitionValues?
    ): Animator? {}

}

public class CustomTransition extends Transition {

    @Override
    public void captureStartValues(TransitionValues values) {}

    @Override
    public void captureEndValues(TransitionValues values) {}

    @Override
    public Animator createAnimator(ViewGroup sceneRoot,
                                   TransitionValues startValues,
                                   TransitionValues endValues) {}
}

Bagian berikut menjelaskan cara mengganti fungsi ini.

Mengambil nilai properti tampilan

Animasi transisi menggunakan sistem animasi properti yang dijelaskan di Ringkasan animasi properti. Properti animasi mengubah properti tampilan dari nilai awal ke nilai akhir di atas properti yang ditentukan sehingga kerangka kerja harus memiliki nilai awal dan akhir properti untuk membangun animasi.

Namun, animasi properti biasanya hanya memerlukan subset kecil dari semua properti tampilan masing-masing. Misalnya, animasi warna memerlukan nilai properti warna, sedangkan gerakan animasi membutuhkan nilai properti posisi. Karena nilai properti yang diperlukan untuk animasi khusus untuk transisi, framework transisi tidak memberikan setiap nilai properti melakukan transisi. Sebagai gantinya, framework akan memanggil fungsi callback yang memungkinkan transisi ke menangkap nilai properti yang dibutuhkan dan menyimpannya dalam kerangka kerja.

Mengambil nilai awal

Untuk meneruskan nilai tampilan awal ke framework, implementasikan metode captureStartValues(transitionValues) . Framework akan memanggil fungsi ini untuk setiap tampilan dalam scene awal. {i>Function<i} Argumen adalah objek TransitionValues yang berisi referensi ke tampilan dan instance Map tempat Anda dapat menyimpan nilai tampilan yang kita inginkan. Dalam implementasi Anda, ambil nilai properti ini dan teruskan kembali ke dengan menyimpannya dalam peta.

Untuk memastikan kunci untuk nilai properti tidak bertentangan dengan nilai lainnya Kunci TransitionValues, gunakan skema penamaan berikut:

package_name:transition_name:property_name

Cuplikan berikut menunjukkan implementasi fungsi captureStartValues():

class CustomTransition : Transition() {

    // Define a key for storing a property value in
    // TransitionValues.values with the syntax
    // package_name:transition_class:property_name to avoid collisions
    private val PROPNAME_BACKGROUND = "com.example.android.customtransition:CustomTransition:background"

    override fun captureStartValues(transitionValues: TransitionValues) {
        // Call the convenience method captureValues
        captureValues(transitionValues)
    }

    // For the view in transitionValues.view, get the values you
    // want and put them in transitionValues.values
    private fun captureValues(transitionValues: TransitionValues) {
        // Get a reference to the view
        val view = transitionValues.view
        // Store its background property in the values map
        transitionValues.values[PROPNAME_BACKGROUND] = view.background
    }

    ...

}

public class CustomTransition extends Transition {

    // Define a key for storing a property value in
    // TransitionValues.values with the syntax
    // package_name:transition_class:property_name to avoid collisions
    private static final String PROPNAME_BACKGROUND =
            "com.example.android.customtransition:CustomTransition:background";

    @Override
    public void captureStartValues(TransitionValues transitionValues) {
        // Call the convenience method captureValues
        captureValues(transitionValues);
    }


    // For the view in transitionValues.view, get the values you
    // want and put them in transitionValues.values
    private void captureValues(TransitionValues transitionValues) {
        // Get a reference to the view
        View view = transitionValues.view;
        // Store its background property in the values map
        transitionValues.values.put(PROPNAME_BACKGROUND, view.getBackground());
    }
    ...
}

Mengambil nilai akhir

Framework ini memanggil fungsi captureEndValues(TransitionValues) sekali untuk setiap tampilan target di adegan akhir. Selain itu, captureEndValues() berfungsi sama seperti captureStartValues().

Cuplikan kode berikut menunjukkan implementasi fungsi captureEndValues():

override fun captureEndValues(transitionValues: TransitionValues) {
    captureValues(transitionValues)
}

@Override
public void captureEndValues(TransitionValues transitionValues) {
    captureValues(transitionValues);
}

Dalam contoh ini, captureStartValues() dan captureEndValues() fungsi memanggil captureValues() untuk mengambil dan menyimpan nilai. Properti tampilan yang diambil captureValues() adalah hal yang sama, tetapi memiliki nilai yang berbeda di awal dan akhir. Framework ini menyimpan peta terpisah untuk titik awal dan akhir status tampilan.

Membuat animator kustom

Untuk menganimasikan perubahan pada tampilan antara statusnya di scene awal dan statusnya di adegan akhir, menyediakan animator dengan mengganti createAnimator() . Saat framework memanggil fungsi ini, fungsi tersebut akan meneruskan tampilan root scene dan Objek TransitionValues yang berisi nilai awal dan akhir yang Anda ambil.

Frekuensi framework memanggil fungsi createAnimator() bergantung pada perubahan yang terjadi di antara adegan awal dan akhir.

Misalnya, pertimbangkan {i>fade-out<i} atau animasi fade-in yang diimplementasikan sebagai transisi kustom. Jika adegan awal memiliki lima target, dua dihapus dari adegan akhir, dan adegan akhir memiliki tiga sasaran dari scene awal ditambah target baru, lalu framework memanggil createAnimator() enam kali. Tiga panggilan menganimasikan fade-out dan fade-in target yang tetap ada di kedua scene objek terstruktur dalam jumlah besar. Dua panggilan lagi menganimasikan fade-out target yang dihapus dari scene akhir. paket Premium AI mengaktifkan animasi fade-in target baru di adegan akhir.

Untuk tampilan target yang ada di adegan awal dan akhir, framework menyediakan objek TransitionValues untuk startValues dan Argumen endValues. Untuk tampilan target yang hanya ada di jendela awal atau scene akhir, framework menyediakan objek TransitionValues untuk argumen yang sesuai dan null untuk argumen lainnya.

Untuk mengimplementasikan fungsi createAnimator(ViewGroup, TransitionValues, TransitionValues) saat Anda membuat transisi kustom, gunakan nilai properti tampilan yang Anda ambil untuk membuat objek Animator dan menampilkannya ke framework. Untuk contoh implementasi, melihat class ChangeColor di class CustomTransition. Untuk informasi selengkapnya tentang animator properti, lihat Animasi properti.

Menerapkan transisi kustom

Transisi kustom sama fungsinya seperti transisi bawaan. Anda dapat menerapkan transisi kustom menggunakan pengelola transisi, seperti yang dijelaskan dalam Menerapkan transisi.