Tài nguyên ảnh động có thể xác định một trong 2 loại ảnh động:
- Ảnh động thuộc tính
- Tạo ảnh động bằng cách sửa đổi giá trị thuộc tính của một đối tượng trong một khoảng thời gian bằng
Animator
. - Ảnh động dạng khung hiển thị
-
Bạn có thể tạo 2 loại ảnh động với khung của ảnh động khung hiển thị:
- Ảnh động lấy giá trị giữa: Tạo một ảnh động bằng cách thực hiện một loạt các phép biến đổi trên một ảnh duy nhất bằng
Animation
. - Ảnh động dạng khung: tạo một ảnh động bằng cách hiện một trình tự hình ảnh theo thứ tự bằng
AnimationDrawable
.
- Ảnh động lấy giá trị giữa: Tạo một ảnh động bằng cách thực hiện một loạt các phép biến đổi trên một ảnh duy nhất bằng
Ảnh động thuộc tính
Một ảnh động được xác định trong tệp XML có chức năng sửa đổi các thuộc tính của đối tượng mục tiêu, chẳng hạn như màu nền hoặc giá trị alpha trong một khoảng thời gian nhất định.
- vị trí tệp:
res/animator/filename.xml
Tên tệp được dùng làm mã nhận dạng tài nguyên.- loại dữ liệu tài nguyên được biên dịch:
- Con trỏ tài nguyên đến
ValueAnimator
,ObjectAnimator
hoặcAnimatorSet
- mã tham chiếu tài nguyên:
-
Trong mã dựa trên Java hoặc Kotlin:
R.animator.filename
Trong XML:@[package:]animator/filename
- cú pháp:
-
<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>
Tệp phải có một phần tử gốc:
<set>
,<objectAnimator>
hoặc<valueAnimator>
. Bạn có thể nhóm các phần tử ảnh động lại với nhau trong phần tử<set>
, bao gồm cả các phần tử<set>
khác. - phần tử:
- ví dụ:
-
Tệp XML được lưu vào
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>
Để chạy ảnh động này, hãy tăng cường tài nguyên XML trong mã của bạn thành một đối tượng
AnimatorSet
, sau đó đặt đối tượng mục tiêu cho tất cả ảnh động trước khi bắt đầu tập hợp ảnh động. Việc gọisetTarget()
sẽ đặt một đối tượng mục tiêu duy nhất cho tất cả thành phần con củaAnimatorSet
để đảm bảo thuận tiện. Mã sau đây minh hoạ cách thực hiện việc này: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();
- xem thêm:
-
- Tổng quan về ảnh động thuộc tính
- Bản minh hoạ API cho các ví dụ về cách sử dụng hệ thống ảnh động thuộc tính
Ảnh động dạng khung hiển thị
Khung của ảnh động dạng khung hiển thị hỗ trợ cả ảnh động lấy giá trị giữa lẫn ảnh động theo từng khung, cả hai đều được khai báo trong tệp XML. Các phần sau đây mô tả cách sử dụng cả hai phương pháp.
Ảnh động lấy giá trị giữa
Là một ảnh động được xác định trong XML thực hiện hiệu ứng chuyển đổi trên một nội dung đồ hoạ như xoay, làm mờ, di chuyển và kéo giãn.
- vị trí tệp:
res/anim/filename.xml
Tên tệp được dùng làm mã nhận dạng tài nguyên.- loại dữ liệu tài nguyên được biên dịch:
- Con trỏ tài nguyên đến
Animation
- mã tham chiếu tài nguyên:
-
Trong Java:
R.anim.filename
Trong XML:@[package:]anim/filename
- cú pháp:
-
<?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>
Tệp phải có một thành phần gốc: thành phần
<alpha>
,<scale>
,<translate>
,<rotate>
hoặc<set>
lưu giữ một nhóm (hoặc nhóm) các thành phần ảnh động khác (thậm chí là các thành phần<set>
lồng nhau). - phần tử:
- ví dụ:
-
Tệp XML được lưu vào
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>
Mã xử lý ứng dụng sau đây áp dụng ảnh động cho
ImageView
và bắt đầu ảnh động đó: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); - xem thêm:
Bộ nội suy
Bộ nội suy là một công cụ sửa đổi ảnh động được xác định trong tệp XML ảnh hưởng đến tốc độ thay đổi trong ảnh động. Công cụ này giúp các hiệu ứng ảnh động hiện có được tăng tốc, giảm tốc, lặp lại, bật nảy lên, v.v.
Bộ nội suy được áp dụng cho phần tử ảnh động có thuộc tính android:interpolator
, giá trị của thuộc tính này tham chiếu đến tài nguyên của bộ nội suy.
Tất cả các bộ nội suy có trong Android đều là lớp con của lớp Interpolator
. Đối với mỗi lớp bộ nội suy, Android sẽ bao gồm một tài nguyên công khai mà bạn có thể tham chiếu để áp dụng bộ nội suy cho ảnh động bằng cách sử dụng thuộc tính android:interpolator
.
Bảng sau đây chỉ định tài nguyên để sử dụng cho từng bộ nội suy:
Lớp bộ nội suy | Mã tài nguyên |
---|---|
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 |
Dưới đây là cách bạn có thể áp dụng một trong các bộ này bằng thuộc tính android:interpolator
:
<set android:interpolator="@android:anim/accelerate_interpolator"> ... </set>
Bộ nội suy tuỳ chỉnh
Nếu không hài lòng với bộ nội suy do nền tảng cung cấp, bạn có thể tạo tài nguyên bộ nội suy tuỳ chỉnh với các thuộc tính đã sửa đổi.
Chẳng hạn, bạn có thể điều chỉnh mức độ tăng tốc cho AnticipateInterpolator
hoặc điều chỉnh số chu kỳ cho CycleInterpolator
. Để thực hiện việc này, bạn cần tạo tài nguyên bộ nội suy của riêng mình trong tệp XML.
- vị trí tệp:
res/anim/filename.xml
Tên tệp được dùng làm mã nhận dạng tài nguyên.- loại dữ liệu tài nguyên được biên dịch:
- Con trỏ tài nguyên đến đối tượng bộ nội suy tương ứng
- mã tham chiếu tài nguyên:
-
Trong XML:
@[package:]anim/filename
- cú pháp:
-
<?xml version="1.0" encoding="utf-8"?> <InterpolatorName xmlns:android="http://schemas.android.com/apk/res/android" android:attribute_name="value" />
Nếu bạn không áp dụng bất kỳ thuộc tính nào, thì bộ nội suy của bạn sẽ hoạt động giống hệt như các thuộc tính do nền tảng cung cấp, như nêu trong bảng trước.
- phần tử:
- Xin lưu ý rằng mỗi cách triển khai
Interpolator
, khi được xác định trong XML, sẽ có tên bắt đầu bằng một chữ cái viết thường. - ví dụ:
-
Tệp XML được lưu vào
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 ảnh động này áp dụng bộ nội suy:
<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" />
Ảnh động dạng khung
Ảnh động được xác định trong XML hiển thị một chuỗi hình ảnh theo thứ tự, như một thước phim.
- vị trí tệp:
res/drawable/filename.xml
Tên tệp được dùng làm mã nhận dạng tài nguyên.- loại dữ liệu tài nguyên được biên dịch:
- Con trỏ tài nguyên đến
AnimationDrawable
- mã tham chiếu tài nguyên:
-
Trong Java:
R.drawable.filename
Trong XML:@[package:]drawable.filename
- cú pháp:
-
<?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>
- phần tử:
- ví dụ:
-
Tệp XML được lưu vào
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>
Mã xử lý ứng dụng sau đây sẽ đặt ảnh động làm nền cho
View
, sau đó phát ảnh động: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()
; } - xem thêm: