Resource animasi dapat menentukan salah satu dari dua jenis animasi:
- Animasi properti
- Buat animasi dengan mengubah nilai properti objek selama periode yang ditetapkan
dengan
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: membuat animasi dengan menampilkan rangkaian 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 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, inflate resource XML dalam kode Anda ke objek
AnimatorSet
, lalu tetapkan 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:
-
- Ringkasan 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 dideklarasikan dalam XML. Bagian berikut menjelaskan cara menggunakan kedua metode tersebut.
Animasi hitung nilai
Animasi yang ditentukan dalam XML yang melakukan transisi pada grafis seperti memutar, memudarkan, menggerakkan, dan meregangkan.
- lokasi file:
res/anim/filename.xml
Nama file 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 (termasuk 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 berikut 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, 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, buat
resource interpolator Anda sendiri dalam file XML.
- lokasi file:
res/anim/filename.xml
Nama file 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 sebelumnya.
- elemen:
- Perhatikan bahwa setiap implementasi
Interpolator
, saat ditentukan dalam XML, memiliki nama yang diawali 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 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 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 berikut menetapkan animasi sebagai latar belakang untuk
View
, 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()
; } - lihat juga: