HarmonyOS GIF动态图片，怎么设置只显示一次？

Question

GIF动态图片，怎么设置只显示一次

咨询场景描述： 有没有动态图的显示状态回调，api没找到此部分

Answer 1

可以使用第三方库gif-drawable，支持Gif渲染及控制 的相关功能。详见https://ohpm.openharmony.cn/\#/cn/detail/@ohos%2Fgif-drawable

可以参考demo

//demo.ets
import { GIFComponent, ResourceLoader } from '@ohos/gif-drawable'
import { image } from '@kit.ImageKit';

@Entry
@Component
struct Index {
  // gif绘制组件用户属性设置
  @State model: GIFComponent.ControllerOptions = new GIFComponent.ControllerOptions();
  // 是否自动播放
  @State gifAutoPlay: boolean = true;
  @State imagePixelMap: image.PixelMap | undefined = undefined
  @State gifReset: boolean = false;

  async aboutToAppear() {
    let modelx = new GIFComponent.ControllerOptions()
    modelx.setScaleType(GIFComponent.ScaleType.FIT_CENTER)
      .setSpeedFactor(1)
      .setOpenHardware(true)
      .setLoopFinish((loopTime:number)=>{
        this.gifAutoPlay = false
      })
    ResourceLoader.loadMedia($r('app.media.gifExample').id, getContext(this)).then((buffer) => {
      modelx.loadBuffer(buffer, (err) => {
        if (err) {
          console.log('loadMediaByWorker error =' + err)
        }
        console.log('loadMedia加载解析成功回调绘制！')
        this.model = modelx;
      })
    })
  }

  build() {
    Row() {
      Column() {
        Text('GIF显示')
        Button('start').onClick(()=>{
          this.gifAutoPlay = true;
        })
        GIFComponent({
          model: $model,
          autoPlay: $gifAutoPlay,
          resetGif: $gifReset,
        })
          .width(300)
          .height(300)
          .backgroundColor(Color.Gray)
      }
      .width('100%')
    }
    .height('100%')
  }
}