HarmonyOS Next——帧动画ImageAnimator组件帧动画：通过逐帧播放一系列图片来实现动画效果，在开发

帧动画：通过逐帧播放一系列图片来实现动画效果，在开发中可以使用ImageAnimator组件来实现帧动画的播放。开发者可以配置需要播放的图片列表，以及每张图片的播放时长，从而实现精细的动画效果。

export const ImageInfoList: ImageFrameInfo[] = [
  {
    src:$rawfile('animages/zfb_icon.png'),
    width:100,
    height:100,
  },
  {
    src:$rawfile('animages/wx_icon.png'),
    width:100,
    height:100
  }
]

import { ImageInfoList } from './ImageInfoList'

@Entry
@Component
struct Index {
@State animationImageList: ImageFrameInfo[] = ImageInfoList
  // 控制动画的状态
  /**
   * Initial:动画初始状态;
   Running:动画处于播放状态;
   Paused:动画处于暂停状态;
   Stopped:动画处于停止状态
   */
 @State animationStatus: AnimationStatus = AnimationStatus.Initial

  build() {
   Column(){
     ImageAnimator()
       .images(this.animationImageList)
       .state(this.animationStatus)
       // 注意：设置播放时长。当Images中任意一帧图片设置了单独的duration后，该属性设置无效。
       .duration(500)
       // /// 设置播放次数,默认播放一次,设置为-1时表示无限次播放。
       .iterations(-1)
       .width(100)
       .aspectRatio(1)
       .margin({top:100,left:20})

     Text('开始')
       .onClick(()=>{
         this.animationStatus = AnimationStatus.Running
       })
   }
    .height('100%')
    .width('100%')
  }
}