สร้างรูปภาพเคลื่อนไหว
จัดทุกอย่างให้เป็นระเบียบอยู่เสมอด้วยคอลเล็กชัน
บันทึกและจัดหมวดหมู่เนื้อหาตามค่ากำหนดของคุณ
นอกจากรูปภาพนิ่งบนหน้าปัดแล้ว ภาพเคลื่อนไหวยังช่วยเพิ่มมิติให้กับประสบการณ์การใช้งานของผู้ใช้
โปรดทราบว่าส่วนนี้เกี่ยวข้องกับการใช้ไฟล์ภาพเคลื่อนไหวโดยเฉพาะ คุณสร้างภาพเคลื่อนไหวของคอมโพเนนต์ในหน้าปัดได้โดยใช้องค์ประกอบ Transform ซึ่งจะอธิบายไว้ในหน้าการเปลี่ยนลักษณะที่ปรากฏขององค์ประกอบแบบไดนามิก
ภาพเคลื่อนไหวอาจประกอบด้วยไฟล์ภาพเคลื่อนไหว เช่น GIF แบบเคลื่อนไหว หรือชุด Images ที่รวมกันเพื่อสร้างภาพเคลื่อนไหว
นอกจากการระบุไฟล์ที่จะใช้แล้ว คุณจะต้องกำหนดลักษณะการทำงานของภาพเคลื่อนไหว เช่น การเล่นซ้ำแบบวนหรือไม่ และหากไม่เล่นซ้ำ จะให้ทำอย่างไรเมื่อสิ้นสุดลง และตัวเลือกอื่นๆ ในกรณีนี้ ให้ใช้ AnimationController
สุดท้าย ให้ใส่ภาพขนาดย่อในภาพเคลื่อนไหวทั้งหมด
เมื่อนำข้อมูลทั้งหมดมารวมกัน คุณจะใช้ภาพเคลื่อนไหวพื้นฐานได้โดยทำดังนี้
<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>
โปรดดูรายละเอียดเพิ่มเติมเกี่ยวกับการใส่รายการภาพเคลื่อนไหวและการสร้างภาพเคลื่อนไหวจากภาพนิ่งในข้อมูลอ้างอิง PartAnimatedImage
ตัวอย่างเนื้อหาและโค้ดในหน้าเว็บนี้ขึ้นอยู่กับใบอนุญาตที่อธิบายไว้ในใบอนุญาตการใช้เนื้อหา Java และ OpenJDK เป็นเครื่องหมายการค้าหรือเครื่องหมายการค้าจดทะเบียนของ Oracle และ/หรือบริษัทในเครือ
อัปเดตล่าสุด 2025-07-27 UTC
[null,null,["อัปเดตล่าสุด 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."]]
