From f38f18b499c7fd74ad9d6c850845db2db24a3985 Mon Sep 17 00:00:00 2001 From: zenggaofeng Date: Mon, 22 Jan 2024 11:27:19 +0800 Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E8=AE=BE=E7=BD=AEgif?= =?UTF-8?q?=E6=92=AD=E6=94=BE=E6=AC=A1=E6=95=B0=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: zenggaofeng --- CHANGELOG.md | 3 + README.md | 54 ++++++++-------- entry/oh-package.json5 | 2 +- .../ets/pages/imageknifeTestCaseIndex.ets | 4 ++ entry/src/main/ets/pages/testGifPlayTimes.ets | 64 +++++++++++++++++++ .../resources/base/profile/main_pages.json | 3 +- library/oh-package.json5 | 2 +- .../imageknife/ImageKnifeComponent.ets | 10 +++ .../imageknife/ImageKnifeOption.ets | 1 + oh-package.json5 | 2 +- 10 files changed, 114 insertions(+), 31 deletions(-) create mode 100644 entry/src/main/ets/pages/testGifPlayTimes.ets diff --git a/CHANGELOG.md b/CHANGELOG.md index f132572..c1217a7 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,6 @@ +## 2.1.2-rc.6 +- 新增设置gif播放次数功能 + ## 2.1.2-rc.5 - moduleContext新增缓存策略，缓存上限5，缓存策略Lru - 适配DevEco Studio 4.1（4.1.3.415）--SDK:API11（ 4.1.0.56） diff --git a/README.md b/README.md index df64d43..242acb2 100644 --- a/README.md +++ b/README.md @@ -107,33 +107,33 @@ imageKnifeOption = { ### ImageKnifeOption参数列表 -| 参数名称 | 入参内容 | 功能简介 | -| ---------------------------- | ------------------------------------------------------------ |-----------------------------------------------| -| loadSrc | string\| PixelMap\ |Resource | 图片数据源 | -| mainScaleType | ScaleType | 设置主图展示样式（可选） | -| strategy | DiskStrategy | 设置磁盘缓存策略（可选） | -| dontAnimateFlag | boolean | gif加载展示一帧（可选） | -| placeholderSrc | PixelMap\| Resource | 占位图数据源 | -| placeholderScaleType | ScaleType | 设置占位图展示样式（可选） | -| errorholderSrc | PixelMap\| Resource | 错误占位图数据源 | -| errorholderSrcScaleType | ScaleType | 设置失败占位图展示样式（可选） | -| retryholderSrc | PixelMap\| Resource | 重试占位图数据源 | -| retryholderScaleType | ScaleType | 设置重试占位图展示样式（可选） | -| thumbSizeMultiplier | number 范围(0,1] | 设置缩略图占比（可选） | -| thumbSizeDelay | number | 设置缩略图展示时间（可选） | -| thumbSizeMultiplierScaleType | ScaleType | 设置缩略图展示样式（可选） | -| displayProgress | boolean | 设置是否展示下载进度条（可选） | -| canRetryClick | boolean | 设置重试图层是否点击重试（可选） | -| onlyRetrieveFromCache | boolean | 仅使用缓存加载数据（可选） | -| isCacheable | boolean | 是否开启一级内存缓存（可选） | -| gif | {
// 返回一周期动画gif消耗的时间
loopFinish?: (loopTime?) => void
// gif播放速率相关
speedFactory?: number
// 直接展示gif第几帧数据
seekTo?: number
} | GIF播放控制能力（可选） | -| transformation | BaseTransform | 单个变换（可选） | -| transformations | Array> | 多个变换,目前仅支持单个变换（可选） | -| allCacheInfoCallback | IAllCacheInfoCallback | 输出缓存相关内容和信息（可选） | -| signature | ObjectKey | 自定key（可选） | -| **drawLifeCycle** | **IDrawLifeCycle** | **用户自定义实现绘制方案（可选）** | -| imageSmoothingEnabled | boolean | 抗锯齿是否开启属性配置，设置为false时，imageSmoothingQuality失效 | -| imageSmoothingQuality | AntiAliasing | 抗锯齿属性配置 | +| 参数名称 | 入参内容 | 功能简介 | +| ---------------------------- |--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|-----------------------------------------------| +| loadSrc | string\ | PixelMap\ |Resource | 图片数据源 | +| mainScaleType | ScaleType | 设置主图展示样式（可选） | +| strategy | DiskStrategy | 设置磁盘缓存策略（可选） | +| dontAnimateFlag | boolean | gif加载展示一帧（可选） | +| placeholderSrc | PixelMap\ | Resource | 占位图数据源 | +| placeholderScaleType | ScaleType | 设置占位图展示样式（可选） | +| errorholderSrc | PixelMap\ | Resource | 错误占位图数据源 | +| errorholderSrcScaleType | ScaleType | 设置失败占位图展示样式（可选） | +| retryholderSrc | PixelMap\ | Resource | 重试占位图数据源 | +| retryholderScaleType | ScaleType | 设置重试占位图展示样式（可选） | +| thumbSizeMultiplier | number 范围(0,1] | 设置缩略图占比（可选） | +| thumbSizeDelay | number | 设置缩略图展示时间（可选） | +| thumbSizeMultiplierScaleType | ScaleType | 设置缩略图展示样式（可选） | +| displayProgress | boolean | 设置是否展示下载进度条（可选） | +| canRetryClick | boolean | 设置重试图层是否点击重试（可选） | +| onlyRetrieveFromCache | boolean | 仅使用缓存加载数据（可选） | +| isCacheable | boolean | 是否开启一级内存缓存（可选） | +| gif | {
// 返回一周期动画gif消耗的时间
loopFinish?: (loopTime?) => void
// gif播放速率相关
speedFactory?: number
// 直接展示gif第几帧数据
seekTo?: number
// 设置gif播放次数
playTimes?: number
} | GIF播放控制能力（可选） | +| transformation | BaseTransform | 单个变换（可选） | +| transformations | Array> | 多个变换,目前仅支持单个变换（可选） | +| allCacheInfoCallback | IAllCacheInfoCallback | 输出缓存相关内容和信息（可选） | +| signature | ObjectKey | 自定key（可选） | +| **drawLifeCycle** | **IDrawLifeCycle** | **用户自定义实现绘制方案（可选）** | +| imageSmoothingEnabled | boolean | 抗锯齿是否开启属性配置，设置为false时，imageSmoothingQuality失效 | +| imageSmoothingQuality | AntiAliasing | 抗锯齿属性配置 | 其他参数只需要在ImageKnifeOption对象上按需添加即可。 diff --git a/entry/oh-package.json5 b/entry/oh-package.json5 index 01beac8..bec89dd 100644 --- a/entry/oh-package.json5 +++ b/entry/oh-package.json5 @@ -4,7 +4,7 @@ "name": "entry", "description": "example description", "repository": {}, - "version": "2.1.2-rc.5", + "version": "2.1.2-rc.6", "dependencies": { "@ohos/libraryimageknife": "file:../sharedlibrary", "@ohos/sharedlibrary2": "file:../sharedlibrary2", diff --git a/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets b/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets index 0161792..c41aaff 100644 --- a/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets +++ b/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets @@ -189,6 +189,10 @@ struct IndexFunctionDemo { .onClick(() => { }).margin({ top: 15 }) + Button("测试gif播放次数") + .onClick(() => { + router.pushUrl({ url: "pages/testGifPlayTimes" }); + }).margin({ top: 15 }) }.width('100%').height(60).backgroundColor(Color.Pink) Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { diff --git a/entry/src/main/ets/pages/testGifPlayTimes.ets b/entry/src/main/ets/pages/testGifPlayTimes.ets new file mode 100644 index 0000000..19025f5 --- /dev/null +++ b/entry/src/main/ets/pages/testGifPlayTimes.ets @@ -0,0 +1,64 @@ +/* + * 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, ImageKnifeOption } from '@ohos/libraryimageknife' + +@Entry +@Component +struct TestGifPlayTimes { + @State ImageKnifeOption1: ImageKnifeOption = { + loadSrc: $r('app.media.icon'), + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed') + } + + build() { + Scroll() { + Column() { + Text("测试gif播放次数").fontSize(25) + Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { + Button("加载网络gif").onClick(() => { + this.ImageKnifeOption1 = { + loadSrc: "https://gd-hbimg.huaban.com/e0a25a7cab0d7c2431978726971d61720732728a315ae-57EskW_fw658", + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed') + } + }) + Button("设置gif播放1次").onClick(() => { + this.ImageKnifeOption1 = { + loadSrc: "https://gd-hbimg.huaban.com/e0a25a7cab0d7c2431978726971d61720732728a315ae-57EskW_fw658", + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + gif: { + playTimes: 1 + } + } + }) + Button("设置gif播放2次").onClick(() => { + this.ImageKnifeOption1 = { + loadSrc: "https://gd-hbimg.huaban.com/e0a25a7cab0d7c2431978726971d61720732728a315ae-57EskW_fw658", + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + gif: { + playTimes: 2 + } + } + }) + } + + ImageKnifeComponent({ imageKnifeOption: this.ImageKnifeOption1 }).width(300).height(300).borderWidth(3) + } + } + } +} \ No newline at end of file diff --git a/entry/src/main/resources/base/profile/main_pages.json b/entry/src/main/resources/base/profile/main_pages.json index a119187..a27cbc3 100644 --- a/entry/src/main/resources/base/profile/main_pages.json +++ b/entry/src/main/resources/base/profile/main_pages.json @@ -38,6 +38,7 @@ "pages/testImageAntiAliasingWithPage", "pages/testImageKnifeRouter1", "pages/testImageKnifeRouter2", - "pages/RequestOptionLoadImage" + "pages/RequestOptionLoadImage", + "pages/testGifPlayTimes" ] } \ No newline at end of file diff --git a/library/oh-package.json5 b/library/oh-package.json5 index ad41c10..ebc85ba 100644 --- a/library/oh-package.json5 +++ b/library/oh-package.json5 @@ -14,7 +14,7 @@ "main": "index.ets", "repository": "https://gitee.com/openharmony-tpc/ImageKnife", "type": "module", - "version": "2.1.2-rc.5", + "version": "2.1.2-rc.6", "dependencies": { "pako": "^2.1.0", "@ohos/disklrucache": "^2.0.2-rc.0", diff --git a/library/src/main/ets/components/imageknife/ImageKnifeComponent.ets b/library/src/main/ets/components/imageknife/ImageKnifeComponent.ets index cdf4302..c71855d 100644 --- a/library/src/main/ets/components/imageknife/ImageKnifeComponent.ets +++ b/library/src/main/ets/components/imageknife/ImageKnifeComponent.ets @@ -41,6 +41,8 @@ export struct ImageKnifeComponent { private gifLoopDuration: number = 0 private startGifLoopTime: number = 0 private endGifLoopTime: number = 0 + // gif 播放次数 + private playTimes: number = 0 // 抗锯齿属性 private imageSmoothingQuality: ImageSmoothingQuality = 'low'; private imageSmoothingEnabled: boolean = true; @@ -708,6 +710,14 @@ 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.imageKnifeOption.gif != undefined ) { + this.playTimes++ + if (this.imageKnifeOption.gif.playTimes == this.playTimes){ + this.autoPlay = false + this.playTimes = 0 + } + } //如果gif动图只有一帧的情况下，不进行后面代码的逐帧绘制循环 if (this.renderFrames_frames != undefined && this.renderFrames_frames.length <= 1) { return diff --git a/library/src/main/ets/components/imageknife/ImageKnifeOption.ets b/library/src/main/ets/components/imageknife/ImageKnifeOption.ets index cab4c2c..204ee1e 100644 --- a/library/src/main/ets/components/imageknife/ImageKnifeOption.ets +++ b/library/src/main/ets/components/imageknife/ImageKnifeOption.ets @@ -42,6 +42,7 @@ export interface GifOptions{ loopFinish?: (loopTime?:number) => void speedFactory?: number seekTo?: number + playTimes?:number } export interface TransformOptions{ transformType: number, diff --git a/oh-package.json5 b/oh-package.json5 index b52c7c4..b7dbed9 100644 --- a/oh-package.json5 +++ b/oh-package.json5 @@ -6,6 +6,6 @@ "name": "imageknife", "description": "example description", "repository": {}, - "version": "2.1.2-rc.5", + "version": "2.1.2-rc.6", "dependencies": {} }