애니메이션 이미지 만들기
컬렉션을 사용해 정리하기
내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요.
시계 화면의 정적 이미지 외에도 애니메이션 이미지를 사용하면 사용자 환경에 한층 더 차원을 높일 수 있습니다.
이 섹션에서는 특히 애니메이션 이미지 파일 사용에 대해 설명합니다. Transform 요소를 사용하여 시계 화면의 구성요소에 애니메이션을 적용할 수 있습니다. 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 참조를 참고하세요.
이 페이지에 나와 있는 콘텐츠와 코드 샘플에는 콘텐츠 라이선스에서 설명하는 라이선스가 적용됩니다. 자바 및 OpenJDK는 Oracle 및 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."]]
