Resource animasi dapat menentukan salah satu dari dua jenis animasi:
- Animasi Properti
- Buat animasi dengan mengubah nilai properti objek selama jangka
waktu tertentu menggunakan
Animator
. - Animasi Tampilan
-
Ada dua jenis animasi yang dapat Anda gunakan dengan framework animasi tampilan:
- Animasi hitung nilai: Membuat animasi dengan menjalankan serangkaian transformasi pada satu gambar
dengan
Animation
- Animasi frame: atau membuat animasi dengan menampilkan urutan gambar secara berurutan
dengan
AnimationDrawable
.
- Animasi hitung nilai: Membuat animasi dengan menjalankan serangkaian transformasi pada satu gambar
dengan
Animasi properti
Animasi yang ditentukan dalam XML yang mengubah properti objek target, seperti warna latar belakang atau nilai alfa, selama jangka waktu tertentu.
- lokasi file:
res/animator/filename.xml
Nama file akan digunakan sebagai ID resource.- jenis data resource yang dihimpun:
- Pointer resource ke
ValueAnimator
,ObjectAnimator
, atauAnimatorSet
. - referensi resource:
-
Dalam kode berbasis Java atau Kotlin:
R.animator.filename
Dalam XML:@[package:]animator/filename
- sintaksis:
-
<set android:ordering=["together" | "sequentially"]> <objectAnimator android:propertyName="string" android:duration="int" android:valueFrom="float | int | color" android:valueTo="float | int | color" android:startOffset="int" android:repeatCount="int" android:repeatMode=["restart" | "reverse"] android:valueType=["intType" | "floatType"]/> <animator android:duration="int" android:valueFrom="float | int | color" android:valueTo="float | int | color" android:startOffset="int" android:repeatCount="int" android:repeatMode=["restart" | "reverse"] android:valueType=["intType" | "floatType"]/> <set> ... </set> </set>
File harus memiliki satu elemen root: baik berupa
<set>
,<objectAnimator>
, atau<valueAnimator>
. Anda dapat mengelompokkan elemen animasi di dalam elemen<set>
, termasuk elemen<set>
lainnya. - elemen:
- contoh:
-
File XML yang disimpan di res/animator/property_animator.xml
:<set android:ordering="sequentially"> <set> <objectAnimator android:propertyName="x" android:duration="500" android:valueTo="400" android:valueType="intType"/> <objectAnimator android:propertyName="y" android:duration="500" android:valueTo="300" android:valueType="intType"/> </set> <objectAnimator android:propertyName="alpha" android:duration="500" android:valueTo="1f"/> </set>
Untuk menjalankan animasi ini, Anda harus meng-inflate resource XML dalam kode Anda ke objek
AnimatorSet
, lalu menetapkan objek target untuk semua animasi sebelum memulai set animasi tersebut. Demi kepraktisan, panggilan kesetTarget()
akan menetapkan satu objek target untuk semua turunanAnimatorSet
. Kode berikut menunjukkan cara melakukannya:Kotlin
val set: AnimatorSet = AnimatorInflater.loadAnimator(myContext, R.animator.property_animator) .apply { setTarget(myObject) start() }
Java
AnimatorSet set = (AnimatorSet) AnimatorInflater.loadAnimator(myContext, R.animator.property_animator); set.setTarget(myObject); set.start();
- lihat juga:
-
- Animasi Properti
- Demo API untuk contoh cara menggunakan sistem animasi properti.
Animasi tampilan
Framework animasi tampilan mendukung animasi hitung nilai dan frame by frame, yang keduanya dapat dideklarasikan dalam XML. Bagian berikut menjelaskan cara menggunakan kedua metode tersebut.Animasi hitung nilai
Animasi yang ditentukan dalam XML yang melakukan transisi seperti merotasi, memudarkan, menggerakkan, dan melebarkan pada grafis.
- lokasi file:
res/anim/filename.xml
Nama file akan digunakan sebagai ID resource.- jenis data resource yang dihimpun:
- Pointer resource ke
Animation
. - referensi resource:
-
Di Java:
R.anim.filename
Dalam XML:@[package:]anim/filename
- sintaksis:
-
<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android" android:interpolator="@[package:]anim/interpolator_resource" android:shareInterpolator=["true" | "false"] > <alpha android:fromAlpha="float" android:toAlpha="float" /> <scale android:fromXScale="float" android:toXScale="float" android:fromYScale="float" android:toYScale="float" android:pivotX="float" android:pivotY="float" /> <translate android:fromXDelta="float" android:toXDelta="float" android:fromYDelta="float" android:toYDelta="float" /> <rotate android:fromDegrees="float" android:toDegrees="float" android:pivotX="float" android:pivotY="float" /> <set> ... </set> </set>
File harus memiliki elemen root tunggal: dapat berupa elemen
<alpha>
,<scale>
,<translate>
,<rotate>
, atau<set>
yang menampung grup (atau beberapa grup) elemen animasi lainnya (bahkan elemen<set>
bertingkat). - elemen:
- contoh:
-
File XML yang disimpan di res/anim/hyperspace_jump.xml
:<set xmlns:android="http://schemas.android.com/apk/res/android" android:shareInterpolator="false"> <scale android:interpolator="@android:anim/accelerate_decelerate_interpolator" android:fromXScale="1.0" android:toXScale="1.4" android:fromYScale="1.0" android:toYScale="0.6" android:pivotX="50%" android:pivotY="50%" android:fillAfter="false" android:duration="700" /> <set android:interpolator="@android:anim/accelerate_interpolator" android:startOffset="700"> <scale android:fromXScale="1.4" android:toXScale="0.0" android:fromYScale="0.6" android:toYScale="0.0" android:pivotX="50%" android:pivotY="50%" android:duration="400" /> <rotate android:fromDegrees="0" android:toDegrees="-45" android:toYScale="0.0" android:pivotX="50%" android:pivotY="50%" android:duration="400" /> </set> </set>
Kode aplikasi ini akan menerapkan animasi ke
ImageView
dan memulai animasi tersebut:Kotlin
val image: ImageView = findViewById(R.id.image) val hyperspaceJump: Animation = AnimationUtils.
loadAnimation
(this, R.anim.hyperspace_jump) image.startAnimation
(hyperspaceJump)Java
ImageView image = (ImageView) findViewById(R.id.image); Animation hyperspaceJump = AnimationUtils.
loadAnimation
(this, R.anim.hyperspace_jump); image.startAnimation
(hyperspaceJump); - lihat juga:
Interpolator
Interpolator adalah pengubah animasi yang ditentukan dalam XML yang memengaruhi laju perubahan dalam animasi. Hal ini dapat membuat efek animasi yang ada dipercepat, diperlambat, diulang, dipantulkan, dll.
Interpolator diterapkan ke elemen animasi dengan atribut android:interpolator
,
yang nilainya merupakan referensi ke resource interpolator.
Semua interpolator yang tersedia di Android merupakan subclass dari class Interpolator
. Untuk setiap class interpolator, Android
menyertakan resource publik yang dapat direferensikan untuk menerapkan interpolator ke animasi
menggunakan atribut android:interpolator
.
Tabel berikut menentukan resource yang akan digunakan untuk masing-masing interpolator:
Class interpolator | ID Resource |
---|---|
AccelerateDecelerateInterpolator |
@android:anim/accelerate_decelerate_interpolator |
AccelerateInterpolator |
@android:anim/accelerate_interpolator |
AnticipateInterpolator |
@android:anim/anticipate_interpolator |
AnticipateOvershootInterpolator |
@android:anim/anticipate_overshoot_interpolator |
BounceInterpolator |
@android:anim/bounce_interpolator |
CycleInterpolator |
@android:anim/cycle_interpolator |
DecelerateInterpolator |
@android:anim/decelerate_interpolator |
LinearInterpolator |
@android:anim/linear_interpolator |
OvershootInterpolator |
@android:anim/overshoot_interpolator |
Berikut adalah cara menerapkan suatu resource dengan atribut android:interpolator
:
<set android:interpolator="@android:anim/accelerate_interpolator"> ... </set>
Interpolator kustom
Jika tidak puas dengan interpolator yang disediakan oleh platform (yang tercantum dalam
tabel di atas), Anda dapat membuat resource interpolator kustom dengan atribut yang dimodifikasi.
Misalnya, Anda dapat menyesuaikan laju
percepatan untuk AnticipateInterpolator
, atau menyesuaikan jumlah
siklus untuk CycleInterpolator
. Untuk melakukannya, Anda harus membuat resource interpolator Anda sendiri dalam file XML.
- lokasi file:
res/anim/filename.xml
Nama file akan digunakan sebagai ID resource.- jenis data resource yang dihimpun:
- Pointer resource ke objek interpolator yang terkait.
- referensi resource:
-
Dalam XML:
@[package:]anim/filename
- sintaksis:
-
<?xml version="1.0" encoding="utf-8"?> <InterpolatorName xmlns:android="http://schemas.android.com/apk/res/android" android:attribute_name="value" />
Jika Anda tidak menerapkan atribut apa pun, interpolator Anda akan berfungsi sama persis dengan interpolator yang disediakan oleh platform (yang tercantum dalam tabel di atas).
- elemen:
- Perhatikan bahwa setiap implementasi
Interpolator
, saat ditentukan dalam XML, namanya akan dimulai dengan huruf kecil. - contoh:
-
File XML yang disimpan di
res/anim/my_overshoot_interpolator.xml
:<?xml version="1.0" encoding="utf-8"?> <overshootInterpolator xmlns:android="http://schemas.android.com/apk/res/android" android:tension="7.0" />
XML animasi ini akan menerapkan interpolator:
<scale xmlns:android="http://schemas.android.com/apk/res/android" android:interpolator="@anim/my_overshoot_interpolator" android:fromXScale="1.0" android:toXScale="3.0" android:fromYScale="1.0" android:toYScale="3.0" android:pivotX="50%" android:pivotY="50%" android:duration="700" />
Animasi frame
Animasi yang ditentukan dalam XML yang menunjukkan serangkaian gambar yang berurutan (seperti film).
- lokasi file:
res/drawable/filename.xml
Nama file akan digunakan sebagai ID resource.- jenis data resource yang dihimpun:
- Pointer resource ke
AnimationDrawable
. - referensi resource:
-
Di Java:
R.drawable.filename
Dalam XML:@[package:]drawable.filename
- sintaksis:
-
<?xml version="1.0" encoding="utf-8"?> <animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot=["true" | "false"] > <item android:drawable="@[package:]drawable/drawable_resource_name" android:duration="integer" /> </animation-list>
- elemen:
- contoh:
-
- File XML yang disimpan di
res/drawable/rocket_thrust.xml
: -
<?xml version="1.0" encoding="utf-8"?> <animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false"> <item android:drawable="@drawable/rocket_thrust1" android:duration="200" /> <item android:drawable="@drawable/rocket_thrust2" android:duration="200" /> <item android:drawable="@drawable/rocket_thrust3" android:duration="200" /> </animation-list>
- Kode aplikasi ini akan menetapkan animasi sebagai latar belakang Tampilan, lalu memutar animasi tersebut:
-
Kotlin
val rocketImage: ImageView = findViewById(R.id.rocket_image) rocketImage.
setBackgroundResource
(R.drawable.rocket_thrust) val rocketAnimation = rocketImage.background
if (rocketAnimation isAnimatable
) { rocketAnimation.start()
}Java
ImageView rocketImage = (ImageView) findViewById(R.id.rocket_image); rocketImage.
setBackgroundResource
(R.drawable.rocket_thrust); rocketAnimation = rocketImage.getBackground()
; if (rocketAnimation instanceofAnimatable
) { ((Animatable)rocketAnimation).start()
; }
- File XML yang disimpan di
- lihat juga: