Tạo ảnh động
Sử dụng bộ sưu tập để sắp xếp ngăn nắp các trang
Lưu và phân loại nội dung dựa trên lựa chọn ưu tiên của bạn.
Ngoài hình ảnh tĩnh trên mặt đồng hồ, hình ảnh động có thể mang lại thêm một chiều kích thước cho trải nghiệm người dùng.
Xin lưu ý rằng phần này chủ yếu nói về việc sử dụng tệp hình ảnh động. Bạn có thể tạo ảnh động cho các thành phần trên mặt đồng hồ bằng phần tử Transform. Phần tử này được đề cập trên trang Thay đổi linh động giao diện của các phần tử.
Ảnh động có thể bao gồm một tệp hình ảnh động, chẳng hạn như ảnh GIF động hoặc một trình tự Images, kết hợp với nhau để tạo thành ảnh động.
Ngoài việc chỉ định các tệp cần sử dụng, bạn cần xác định cách hoạt động của ảnh động, chẳng hạn như có lặp lại quá trình phát hay không, nếu không thì cần làm gì khi kết thúc, cùng với các tuỳ chọn khác. Để thực hiện việc này, hãy sử dụng AnimationController.
Cuối cùng, đối với tất cả ảnh động, hãy thêm hình thu nhỏ vào tất cả ảnh động.
Khi kết hợp tất cả những điều này, bạn có thể triển khai ảnh động cơ bản như sau:
<PartAnimatedImage x="0" y="0" width="450" height="450">
<AnimationController play="ON_VISIBLE"/>
<AnimatedImage resource="my_animation" format="AGIF"/>
<Thumbnail resource="my_animation_thumbnail" />
</PartAnimatedImage>
Hãy tham khảo tài liệu tham khảo về PartAnimatedImage để biết thêm thông tin chi tiết về cách đưa vào danh sách hình ảnh động và tạo ảnh động từ hình ảnh tĩnh.
Nội dung và mã mẫu trên trang này phải tuân thủ các giấy phép như mô tả trong phần Giấy phép nội dung. Java và OpenJDK là nhãn hiệu hoặc nhãn hiệu đã đăng ký của Oracle và/hoặc đơn vị liên kết của Oracle.
Cập nhật lần gần đây nhất: 2025-07-27 UTC.
[[["Dễ hiểu","easyToUnderstand","thumb-up"],["Giúp tôi giải quyết được vấn đề","solvedMyProblem","thumb-up"],["Khác","otherUp","thumb-up"]],[["Thiếu thông tin tôi cần","missingTheInformationINeed","thumb-down"],["Quá phức tạp/quá nhiều bước","tooComplicatedTooManySteps","thumb-down"],["Đã lỗi thời","outOfDate","thumb-down"],["Vấn đề về bản dịch","translationIssue","thumb-down"],["Vấn đề về mẫu/mã","samplesCodeIssue","thumb-down"],["Khác","otherDown","thumb-down"]],["Cập nhật lần gần đây nhất: 2025-07-27 UTC."],[],[],null,["# Create animated images\n\nIn addition to static images on the watch face, animated images can bring a\nfurther dimension to the user experience.\n\nNote that this section is specifically about using animated image files. It is\npossible to animate components on the watch face using the `Transform` element,\nwhich is covered on the [Dynamically changing the appearance of\nelements](/training/wearables/wff/transform) page.\n\nAnimations can consist of either an animated image file, such as an animated\nGIF, or a sequence of `Images`, which combine together to form an animation.\n\nAs well as specifying the files to use, you'll need to define how the animation\nshould behave, for example, whether to loop the playback, or if not, what to do\nat the end, among other options. For this, use an [`AnimationController`](/training/wearables/wff/group/part/animated-image/animation-controller).\n\nFinally, for all animations, include a [thumbnail\nimage](/training/wearables/wff/group/part/animated-image/thumbnail) in all animations.\n\nPutting this together, a basic animation can be implemented as follows: \n\n \u003cPartAnimatedImage x=\"0\" y=\"0\" width=\"450\" height=\"450\"\u003e\n \u003cAnimationController play=\"ON_VISIBLE\"/\u003e\n \u003cAnimatedImage resource=\"my_animation\" format=\"AGIF\"/\u003e\n \u003cThumbnail resource=\"my_animation_thumbnail\" /\u003e\n \u003c/PartAnimatedImage\u003e\n\nConsult the [`PartAnimatedImage`](/training/wearables/wff/group/part/animated-image/part-animated-image) reference for more details on including a\nlist of animated images and constructing an animation from still images."]]
