Android Dev Summit, October 23-24: two days of technical content, directly from the Android team. Sign-up for livestream updates.

Ringkasan Animasi

Animasi dapat menambahkan petunjuk visual yang memberi tahu pengguna tentang apa yang terjadi di aplikasi Anda. Animasi sangat berguna saat UI berubah status, seperti ketika konten baru dimuat atau tindakan baru tersedia. Animasi juga berperan memperindah aplikasi Anda, yang memberikannya penampilan dan kesan yang lebih berkualitas.

Android menyertakan berbagai API animasi sesuai jenis animasi apa yang Anda inginkan, oleh karena itu halaman ini memberikan ringkasan tentang berbagai cara yang dapat Anda gunakan untuk menambahkan gerakan ke UI Anda.

Untuk lebih memahami kapan Anda harus menggunakan animasi, lihat juga panduan desain material untuk gerakan.

Menganimasikan bitmap

Gambar 1. Tombol yang dianimasikan

Saat ingin menganimasikan grafik bitmap seperti ikon atau ilustrasi, Anda harus menggunakan API animasi yang dapat digambar. Biasanya, animasi tersebut didefinisikan secara statis dengan resource yang dapat digambar, tetapi Anda juga dapat menentukan perilaku animasi saat waktu proses.

Misalnya, menganimasikan tombol putar agar berubah menjadi tombol jeda ketika diketuk adalah cara yang baik untuk mengomunikasikan ke pengguna bahwa kedua tindakan tersebut terkait, dan dengan menekan salah satunya akan membuat yang lain terlihat.

Untuk informasi selengkapnya, baca Menganimasikan Grafik yang Dapat Digambar.

Menganimasikan gerakan dan visibilitas UI

Gambar 2. Animasi halus saat dialog muncul dan menghilang membuat perubahan UI terlihat lebih mulus

Saat perlu mengubah visibilitas atau posisi tampilan di tata letak, Anda harus menyertakan animasi halus untuk membantu pengguna memahami bagaimana UI berubah.

Untuk memindahkan, menampilkan, atau menyembunyikan tampilan dalam tata letak saat ini, Anda dapat menggunakan sistem animasi properti yang diberikan oleh paket android.animation, tersedia di Android 3.0 (API level 11) dan yang lebih tinggi. API tersebut memperbarui properti objek View Anda selama periode waktu tertentu, dengan terus-menerus menggambar ulang tampilan seiring perubahan properti. Misalnya, ketika mengubah properti posisi, tampilan bergerak melintasi layar, atau saat Anda mengubah properti alpha, tampilan akan menjadi jelas atau memudar.

Untuk membuat animasi ini dengan mudah, Anda dapat mengaktifkan animasi pada tata letak sehingga saat Anda hanya mengubah visibilitas tampilan, sebuah animasi otomatis akan berlaku. Untuk informasi selengkapnya, lihat Otomatis Menganimasikan Update Tata Letak.

Untuk mempelajari cara membuat animasi dengan sistem animasi properti, baca Ringkasan Animasi Properti. Atau lihat halaman berikut untuk membuat animasi umum:

Gerakan berbasis fisika

Gambar 3. Animasi dibuat dengan ObjectAnimator

Gambar 4. Animasi dibuat dengan API berbasis fisika

Jika memungkinkan, animasi Anda harus menerapkan prinsip fisika sebenarnya sehingga tampak alami. Misalnya, animasi harus menjaga momentum ketika targetnya berubah, dan melakukan transisi yang mulus selama perubahan apa pun.

Untuk memberikan perilaku tersebut, Android Support library menyertakan API animasi berbasis fisika yang mengandalkan hukum fisika untuk mengontrol bagaimana animasi Anda terjadi.

Dua animasi umum berbasis fisika adalah:

Animasi yang tidak didasarkan pada fisika—seperti yang dibuat dengan ObjectAnimator API—akan terlihat cukup statis dan memiliki durasi tetap. Jika nilai target berubah, Anda harus membatalkan animasi pada saat perubahan nilai target, mengonfigurasi ulang animasi dengan nilai baru sebagai nilai awal baru, dan menambahkan nilai target baru. Secara visual, proses ini menciptakan penghentian mendadak dalam animasi, dan gerakan terputus setelahnya, seperti yang ditunjukkan pada gambar 3.

Sedangkan, animasi yang dibuat oleh API animasi berbasis fisika seperti DynamicAnimation akan terlihat seperti didorong oleh gaya. Perubahan nilai target menghasilkan perubahan pada gaya tersebut. Gaya baru akan berlaku pada kecepatan yang ada, dan membuat transisi berkelanjutan ke target baru. Proses ini menghasilkan animasi yang tampak lebih alami, seperti yang ditunjukkan pada gambar 4.

Menganimasikan perubahan tata letak

Gambar 5. Animasi untuk menampilkan detail lainnya dapat dicapai dengan mengubah tata letak atau memulai aktivitas baru

Pada Android 4.4 (API level 19) dan yang lebih tinggi, Anda dapat menggunakan framework transisi untuk membuat animasi saat menukar tata letak dalam aktivitas atau fragmen saat ini. Yang perlu dilakukan adalah menentukan tata letak awal dan akhir, serta jenis animasi apa yang ingin Anda gunakan. Kemudian, sistem akan mencari dan menjalankan animasi antara dua tata letak. Anda dapat menggunakan animasi ini untuk menukar seluruh UI atau memindahkan/mengganti beberapa tampilan saja.

Misalnya, ketika pengguna mengetuk suatu item untuk melihat informasi selengkapnya, Anda dapat mengganti tata letak dengan detail item yang menerapkan transisi seperti yang ditunjukkan pada gambar 5.

Tata letak awal dan akhir masing-masing disimpan dalam suatu Scene, meskipun scene awal biasanya otomatis ditentukan dari tata letak saat ini. Kemudian, buat Transition untuk memberi tahu sistem jenis animasi apa yang Anda inginkan, lalu panggil TransitionManager.go() dan sistem akan menjalankan animasi untuk menukar tata letak.

Untuk informasi selengkapnya, baca Menganimasikan Antara Tata Letak Menggunakan Transisi. Dan untuk kode contoh, periksa BasicTransition.

Menganimasikan antara aktivitas

Di Android 5.0 (API level 21) dan yang lebih tinggi, Anda juga dapat membuat animasi yang bertransisi di antara aktivitas Anda. Animasi ini didasarkan pada framework transisi yang sama seperti yang dideskripsikan di atas untuk menganimasikan perubahan tata letak, tetapi memungkinkan Anda untuk membuat animasi di antara tata letak dalam aktivitas terpisah.

Anda dapat menerapkan animasi sederhana seperti menggeser aktivitas baru dari samping atau memasukkannya, tetapi Anda juga dapat membuat animasi yang bertransisi antara tampilan bersama di setiap aktivitas. Misalnya, ketika pengguna mengetuk item untuk melihat informasi selengkapnya, Anda dapat beralih ke aktivitas baru dengan animasi yang meluaskan item tersebut untuk mengisi layar, seperti animasi yang ditunjukkan pada gambar 5.

Seperti biasa, panggil startActivity(), tetapi teruskan bundel opsi yang diberikan oleh ActivityOptions.makeSceneTransitionAnimation(). Bundel opsi ini dapat mencakup tampilan mana yang dibagikan di antara aktivitas sehingga framework transisi dapat menghubungkannya selama animasi.

Untuk semua detailnya, lihat Memulai Aktivitas dengan Animasi. Dan untuk kode contoh, lihat ActivitySceneTransitionBasic.