!311 增加gif图duration的默认值，以及默认播放次数

Merge pull request !311 from zgf/master

CHANGELOG.md

@@ -1,3 +1,6 @@
+## 2.3.0-rc.0
+- 增加gif图duration的默认值，以及默认播放次数
+
 ## 2.2.0
 - 修复错误图绘制完后变成占位图
 - 提供图片加载成功/失败的事件

entry/src/main/ets/pages/TestDurationAndPlayTimesPage.ets

@@ -0,0 +1,42 @@
+/*
+ * Copyright (C) 2024 Huawei Device Co., Ltd.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { ImageKnifeComponent, } from '@ohos/libraryimageknife'
+
+
+@Entry
+@Component
+struct TestDurationAndPlayTimesPage {
+  build() {
+    Column() {
+      ImageKnifeComponent({
+        imageKnifeOption: {
+          loadSrc: "https://n.sinaimg.cn/default/944aebbe/20230131/diamond_1.gif",
+          placeholderSrc: $r('app.media.icon_loading'),
+          errorholderSrc: $r('app.media.icon_failed')
+        }
+      }).width(300)
+        .height(300)
+        .backgroundColor(Color.Orange)
+      Image("https://n.sinaimg.cn/default/944aebbe/20230131/diamond_1.gif")
+        .width(300)
+        .height(300)
+        .backgroundColor(Color.Orange)
+        .objectFit(ImageFit.Contain)
+        .margin({top:20})
+    }
+    .width('100%')
+    .height('100%')
+  }
+}

entry/src/main/ets/pages/imageknifeTestCaseIndex.ets

@@ -242,9 +242,9 @@ struct IndexFunctionDemo {
               router.pushUrl({ url: "pages/svgTestCasePage" });
             }).margin({ top: 15 })
 
-          Button("测试gif已转移,不再使用worker")
+          Button("测试特殊gif图Image对比")
             .onClick(() => {
-
+              router.pushUrl({ url: "pages/TestDurationAndPlayTimesPage" });
             }).margin({ top: 15 })
         }.width('100%').height(60).backgroundColor(Color.Pink)
 

entry/src/main/resources/base/profile/main_pages.json

@@ -61,6 +61,7 @@
     "pages/testReuseAblePages",
     "pages/downsamplingPage",
     "pages/testImageKnifeLoadState",
-    "pages/testImageKnifeRemoveCache"
+    "pages/testImageKnifeRemoveCache",
+    "pages/TestDurationAndPlayTimesPage"
   ]
 }

library/src/main/ets/components/imageknife/ImageKnife.ets

@@ -808,6 +808,7 @@ export class ImageKnife {
           let imageKnifeData = ImageKnifeData.createImageGIFFrame(ImageKnifeType.GIFFRAME, data as GIFFrame[]);
           let requestList: List<RequestOption> | undefined = this.executingJobMap.get(request.uuid);
           LogUtil.info("VISIBLE: taskpool execute done. data as GIFFrame: " + requestList?.length);
+          imageKnifeData.iterations = data[0].iterations
           // 组件被销毁会删除请求，因此requestList可能是undefined
           if(requestList != undefined) {
             requestList.forEach((requestOption: RequestOption)=>{

library/src/main/ets/components/imageknife/ImageKnifeComponent.ets

@@ -56,6 +56,7 @@ export struct ImageKnifeComponent {
   private imageSmoothingEnabled: boolean = true;
   // 是否是gif图片
   private isGif: boolean = false
+  private gifPlayTimes: number = 0
   defaultLifeCycle: IDrawLifeCycle = {
 
     // 展示占位图
@@ -875,7 +876,7 @@ export struct ImageKnifeComponent {
       this.renderFrames_context = context
       this.renderFrames_compWidth = compWidth
       this.renderFrames_compHeight = compHeight
-
+      this.gifPlayTimes = data.iterations
       this.renderFrames()
     }
   }
@@ -916,6 +917,13 @@ export struct ImageKnifeComponent {
     // draw Frame
     this.drawFrame(this.renderFrames_frames, this.renderFrames_index, this.renderFrames_context, this.renderFrames_compWidth, this.renderFrames_compHeight);
     // gif播放次数
+    if (this.renderFrames_frames != undefined && this.renderFrames_index === (this.renderFrames_frames.length - 1) && this.gifPlayTimes != 0 && this.imageKnifeOption.gif == undefined ) {
+      this.playTimes++
+      if (this.gifPlayTimes == this.playTimes){
+        this.imageKnifeOption.autoPlay = false;
+        this.playTimes = 0
+      }
+    }
     if (this.renderFrames_frames != undefined && this.renderFrames_index === (this.renderFrames_frames.length - 1) && this.imageKnifeOption.gif != undefined ) {
       this.playTimes++
       if (this.imageKnifeOption.gif.playTimes == this.playTimes){
@@ -961,7 +969,11 @@ export struct ImageKnifeComponent {
       if (this.renderFrames_frames != undefined && this.renderFrames_index >= this.renderFrames_frames.length) {
         this.renderFrames_index = 0;
       }
-      this.gifTimerId = setTimeout(this.renderFrames, delayTime)
+      if (delayTime == 0) {
+        this.gifTimerId = setTimeout(this.renderFrames, 100)
+      } else {
+        this.gifTimerId = setTimeout(this.renderFrames, delayTime)
+      }
     }
   }
 

library/src/main/ets/components/imageknife/ImageKnifeData.ets

@@ -96,6 +96,7 @@ export class ImageKnifeData {
   static BMP = 'bmp';
   static WEBP = 'webp';
   waitSaveDisk = false;
+  iterations: number = 0
   imageKnifeType: ImageKnifeType | undefined = undefined;
   drawPixelMap: DrawPixelMap | undefined = undefined;
   drawGIFFrame: DrawGIFFrame | undefined = undefined;

library/src/main/ets/components/imageknife/utils/gif/GIFFrame.ts

@@ -44,4 +44,6 @@ export class GIFFrame {
 
     // 表示透明度的可选颜色索引
     transparentIndex: number
+    // 默认播放次数
+    iterations?:number
 }

library/src/main/ets/components/imageknife/utils/gif/GIFParseImpl.ets

@@ -67,11 +67,18 @@ export class GIFParseImpl implements IParseGif {
       }
     })
     let data: GIFFrame[] = [];
+    let iterations: number = 0
     imageSource.createPixelMapList(decodeOpts).then((pixelList: Array<PixelMap>) => {
       //sdk的api接口发生变更：从.getDelayTime() 变为.getDelayTimeList()
-      imageSource.getDelayTimeList().then(delayTimes => {
+      imageSource.getDelayTimeList().then(async (delayTimes) => {
         if (pixelList.length > 0) {
           let pixelmap1 = pixelList[0];
+          try {
+            let dataTimes = await imageSource.getImageProperty(image.PropertyKey.GIF_LOOP_COUNT)
+            iterations = Number(dataTimes)
+          } catch (e) {
+            iterations = 1
+          }
           pixelmap1.getImageInfo().then(imageInfo => {
             for (let i = 0; i < pixelList.length; i++) {
               let frame = new GIFFrame();
@@ -84,6 +91,7 @@ export class GIFParseImpl implements IParseGif {
               }
               data.push(frame)
             }
+            data[0].iterations = iterations
             callback(data, undefined)
             imageSource.release();
           }).catch((err: string) => {