From 6b126f63ec8fc8e1825bda8ad42979bf00299b5c Mon Sep 17 00:00:00 2001 From: tsm <2418639820@qq.com> Date: Mon, 6 May 2024 09:46:38 +0800 Subject: [PATCH 1/3] =?UTF-8?q?imageKnife=E9=99=8D=E9=87=87=E6=A0=B7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: tsm <2418639820@qq.com> --- entry/src/main/ets/pages/DownsamplingPage.ets | 360 ++++++++++++++++++ .../ets/pages/imageknifeTestCaseIndex.ets | 4 + .../resources/base/profile/main_pages.json | 3 +- .../ets/test/DefaultJobQueueTest.test.ets | 9 +- library/index.ets | 7 +- .../Downsampling/BaseDownsampling.ets | 26 ++ .../Downsampling/DownsampleStartegy.ets | 144 +++++++ .../imageknife/Downsampling/Downsampler.ets | 134 +++++++ .../ets/components/imageknife/ImageKnife.ets | 3 +- .../imageknife/ImageKnifeComponent.ets | 3 + .../imageknife/ImageKnifeOption.ets | 6 +- .../components/imageknife/RequestOption.ets | 9 +- .../components/imageknife/SendableData.ets | 11 +- .../imageknife/interface/IParseImage.ets | 3 +- .../requestmanage/RequestManager.ets | 34 +- .../imageknife/utils/ParseImageUtil.ets | 26 +- .../imageknife/utils/gif/GIFParseImpl.ets | 36 +- .../imageknife/utils/gif/IParseGif.ets | 9 +- .../imageknife/utils/svg/SVGParseImpl.ets | 47 ++- 19 files changed, 822 insertions(+), 52 deletions(-) create mode 100644 entry/src/main/ets/pages/DownsamplingPage.ets create mode 100644 library/src/main/ets/components/imageknife/Downsampling/BaseDownsampling.ets create mode 100644 library/src/main/ets/components/imageknife/Downsampling/DownsampleStartegy.ets create mode 100644 library/src/main/ets/components/imageknife/Downsampling/Downsampler.ets diff --git a/entry/src/main/ets/pages/DownsamplingPage.ets b/entry/src/main/ets/pages/DownsamplingPage.ets new file mode 100644 index 0000000..05f2976 --- /dev/null +++ b/entry/src/main/ets/pages/DownsamplingPage.ets @@ -0,0 +1,360 @@ +/* + * 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 { + FitCenter, + ImageKnifeComponent, + ImageKnifeData, + ImageKnifeGlobal, + ImageKnifeOption, + RequestOption +} from '@ohos/libraryimageknife' +import { BusinessError } from '@ohos.base' +import { fitter, sampleNone } from '@ohos/imageknife'; + +let pngUrl = $r('app.media.pngSample'); +let jpgUrl = $r('app.media.jpgSample'); +let svgUrl = $r('app.media.svgSample'); +let gifUrl = $r('app.media.gifSample'); +let bmpUrl = $r('app.media.bmpSample'); +let webpUrl = $r('app.media.webpSample'); +let ImageKnife = ImageKnifeGlobal.getInstance().getImageKnife(); + +@Entry +@Component +struct Index { + @State mSquarePixelMap1?: PixelMap = undefined; + @State mSquarePixelMap2?: PixelMap = undefined; + @State h: number = 0 + @State w: number = 0 + @State BytesNumber1: number = 0 + @State BytesNumber2: number = 0 + @State url: string = '' + @State network: Boolean = false + @State ImageKnifeOption1: ImageKnifeOption = { + loadSrc: $r('app.media.icon'), + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed') + } + + transformSquare1(mUrl: ESObject) { + let imageKnifeOption: RequestOption = new RequestOption(); + imageKnifeOption.load(mUrl) + .addListener({ + callback: (err: BusinessError | string, data: ImageKnifeData) => { + this.mSquarePixelMap1 = data.drawPixelMap?.imagePixelMap as PixelMap; + this.BytesNumber1 = (data.drawPixelMap?.imagePixelMap as PixelMap).getPixelBytesNumber() + return false; + } + }) + ImageKnife?.call(imageKnifeOption); + } + + transformSquare2(mUrl: ESObject) { + let imageKnifeOption: RequestOption = new RequestOption(); + let a = new fitter() + imageKnifeOption.load(mUrl) + .addListener({ + callback: (err: BusinessError | string, data: ImageKnifeData) => { + this.mSquarePixelMap2 = data.drawPixelMap?.imagePixelMap as PixelMap; + this.BytesNumber2 = (data.drawPixelMap?.imagePixelMap as PixelMap).getPixelBytesNumber() + return false; + } + }) + .setImageViewSize({ width: this.w, height: this.h }) + .downsampleOf(a) + ImageKnife?.call(imageKnifeOption); + } + + @Builder + TextInputSample() { + Flex() { + TextInput({ placeholder: '输入宽' }) + .onChange((EnterKeyType) => { + this.w = Number(EnterKeyType) + }) + TextInput({ placeholder: '输入高' }) + .onChange((EnterKeyType) => { + this.h = Number(EnterKeyType) + }) + }.padding(20) + } + + build() { + Scroll() { + Column() { + Row() { + Button('切换网络图片') + .onClick(() => { + this.network = !this.network + }) + Text('输入网络图片url') + TextInput({ placeholder: '输入url' }) + .onChange((urls) => { + this.url = urls + }) + } + + if (this.network) { + Column() { + Text('原图') + Flex() { + Button('png') + .onClick(() => { + this.transformSquare1(this.url); + + }); + Button('svg') + .onClick(() => { + this.transformSquare1(this.url); + + }); + Button('bmp') + .onClick(() => { + this.transformSquare1(this.url); + + }); + Button('jpg') + .onClick(() => { + this.transformSquare1(this.url); + + }); + Button('gif') + .onClick(() => { + this.transformSquare1(this.url); + + }); + Button('webp') + .onClick(() => { + this.transformSquare1(this.url); + + }); + }.margin({ top: 20, bottom: 20 }) + + Text("原图字节大小：" + this.BytesNumber1) + Column() { + if (this.mSquarePixelMap1) { + Image(this.mSquarePixelMap1 == undefined ? '' : this.mSquarePixelMap1!) + .objectFit(ImageFit.Fill) + .width(200) + .height(200) + .margin({ top: 10 }) + } + Text('component用法') + + }.height(300).width('100%').backgroundColor(Color.Pink) + + Text('降采样图片') + Flex() { + Button('png') + .onClick(() => { + this.transformSquare2(this.url); + this.ImageKnifeOption1 = { + loadSrc: pngUrl, + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + } + }); + Button('svg') + .onClick(() => { + this.transformSquare2(this.url); + this.ImageKnifeOption1 = { + loadSrc: svgUrl, + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + } + + }); + Button('bmp') + .onClick(() => { + this.transformSquare2(this.url); + this.ImageKnifeOption1 = { + loadSrc: bmpUrl, + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + } + }); + Button('jpg') + .onClick(() => { + this.transformSquare2(this.url); + this.ImageKnifeOption1 = { + loadSrc: jpgUrl, + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + } + }); + Button('gif') + .onClick(() => { + // this.transformSquare2(this.url); + this.ImageKnifeOption1 = { + loadSrc: gifUrl, + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + } + }); + Button('webp') + .onClick(() => { + // this.transformSquare2(this.url); + this.ImageKnifeOption1 = { + loadSrc: webpUrl, + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + } + }); + }.margin({ top: 20, bottom: 20 }) + + Text("降采样字节大小:" + this.BytesNumber2) + this.TextInputSample() + Column() { + if (this.mSquarePixelMap2) { + Image(this.mSquarePixelMap2 == undefined ? '' : this.mSquarePixelMap2!) + .objectFit(ImageFit.Fill) + .width(200) + .height(200) + .margin({ top: 10 }) + } + Text('component用法') + ImageKnifeComponent({ imageKnifeOption: this.ImageKnifeOption1 }).width(200).height(200) + }.height(300).width('100%').backgroundColor(Color.Pink) + }.backgroundColor(Color.Orange) + } else { + Column() { + Text('原图') + Flex() { + Button('png') + .onClick(() => { + this.transformSquare1(pngUrl); + + }); + Button('svg') + .onClick(() => { + this.transformSquare1(svgUrl); + + }); + Button('bmp') + .onClick(() => { + this.transformSquare1(bmpUrl); + + }); + Button('jpg') + .onClick(() => { + this.transformSquare1(jpgUrl); + + }); + Button('gif') + .onClick(() => { + this.transformSquare1(gifUrl); + + }); + Button('webp') + .onClick(() => { + this.transformSquare1(webpUrl); + + }); + }.margin({ top: 20, bottom: 20 }) + + Text("原图字节大小：" + this.BytesNumber1) + Column() { + if (this.mSquarePixelMap1) { + Image(this.mSquarePixelMap1 == undefined ? '' : this.mSquarePixelMap1!) + .objectFit(ImageFit.Fill) + .width(200) + .height(200) + .margin({ top: 10 }) + } + Text('component用法') + + }.height(300).width('100%').backgroundColor(Color.Pink) + + Text('降采样图片') + Flex() { + Button('png') + .onClick(() => { + this.transformSquare2(pngUrl); + this.ImageKnifeOption1 = { + loadSrc: pngUrl, + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + } + }); + Button('svg') + .onClick(() => { + this.transformSquare2(svgUrl); + this.ImageKnifeOption1 = { + loadSrc: svgUrl, + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + } + + }); + Button('bmp') + .onClick(() => { + this.transformSquare2(bmpUrl); + this.ImageKnifeOption1 = { + loadSrc: bmpUrl, + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + } + }); + Button('jpg') + .onClick(() => { + this.transformSquare2(jpgUrl); + this.ImageKnifeOption1 = { + loadSrc: jpgUrl, + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + } + }); + Button('gif') + .onClick(() => { + // this.transformSquare2(gifUrl); + this.ImageKnifeOption1 = { + loadSrc: gifUrl, + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + } + }); + Button('webp') + .onClick(() => { + // this.transformSquare2(webpUrl); + this.ImageKnifeOption1 = { + loadSrc: webpUrl, + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + } + }); + }.margin({ top: 20, bottom: 20 }) + + Text("降采样字节大小:" + this.BytesNumber2) + this.TextInputSample() + Column() { + if (this.mSquarePixelMap2) { + Image(this.mSquarePixelMap2 == undefined ? '' : this.mSquarePixelMap2!) + .objectFit(ImageFit.Fill) + .width(200) + .height(200) + .margin({ top: 10 }) + } + Text('component用法') + ImageKnifeComponent({ imageKnifeOption: this.ImageKnifeOption1 }).width(200).height(200) + }.height(300).width('100%').backgroundColor(Color.Pink) + } + } + } + } + .height('100%') + } +} + diff --git a/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets b/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets index 68c7303..190d06d 100644 --- a/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets +++ b/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets @@ -40,6 +40,10 @@ struct IndexFunctionDemo { console.log("优先级加载") router.pushUrl({ url: "pages/testPriorityComponent" }); }).margin({ top: 5, left: 3 }) + Button("下采样加载") + .onClick(() => { + router.pushUrl({ url: "pages/DownsamplingPage" }); + }).margin({ top: 5, left: 3 }) }.width('100%').height(60).backgroundColor(Color.Pink) Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { diff --git a/entry/src/main/resources/base/profile/main_pages.json b/entry/src/main/resources/base/profile/main_pages.json index affb988..e08b039 100644 --- a/entry/src/main/resources/base/profile/main_pages.json +++ b/entry/src/main/resources/base/profile/main_pages.json @@ -57,6 +57,7 @@ "pages/testImageKnifeHeic", "pages/testImageKnifeNetPlaceholder", "pages/testCustomDataFetchClientWithPage", - "pages/testReuseAblePages" + "pages/testReuseAblePages", + "pages/DownsamplingPage" ] } \ No newline at end of file diff --git a/entry/src/ohosTest/ets/test/DefaultJobQueueTest.test.ets b/entry/src/ohosTest/ets/test/DefaultJobQueueTest.test.ets index e1c1401..3212de0 100644 --- a/entry/src/ohosTest/ets/test/DefaultJobQueueTest.test.ets +++ b/entry/src/ohosTest/ets/test/DefaultJobQueueTest.test.ets @@ -18,7 +18,7 @@ import { DefaultJobQueue } from '@ohos/imageknife/src/main/ets/components/imagek import { IJobQueue } from '@ohos/imageknife/src/main/ets/components/imageknife/utils/IJobQueue'; import taskpool from '@ohos.taskpool'; import common from '@ohos.app.ability.common'; - +import { fitter} from '@ohos/imageknife'; export default function DefaultJobQueueTest() { describe('DefaultJobQueueTest', () => { @@ -52,6 +52,13 @@ export default function DefaultJobQueueTest() { expect(imageKnife.maxRequests).assertEqual(10); }; }) + it("downsampleOf", 1, () => { + let request: RequestOption = new RequestOption() + if (request) { + let requests = request.downsampleOf(new fitter()) + expect(requests.downsampType.getName()=='FitCenter').assertTrue() + }; + }) }); } diff --git a/library/index.ets b/library/index.ets index 5e8d3ca..5df1e49 100644 --- a/library/index.ets +++ b/library/index.ets @@ -130,4 +130,9 @@ export { GIFFrame } from './src/main/ets/components/imageknife/utils/gif/GIFFram export { IDrawLifeCycle } from './src/main/ets/components/imageknife/interface/IDrawLifeCycle' // 日志管理 -export { LogUtil } from './src/main/ets/components/imageknife/utils/LogUtil' \ No newline at end of file +export { LogUtil } from './src/main/ets/components/imageknife/utils/LogUtil' + +/*下采样*/ +export {Downsampler} from './src/main/ets/components/imageknife/Downsampling/Downsampler' + +export {DownsampleNone as sampleNone, FitCenter as fitter} from './src/main/ets/components/imageknife/Downsampling/DownsampleStartegy' \ No newline at end of file diff --git a/library/src/main/ets/components/imageknife/Downsampling/BaseDownsampling.ets b/library/src/main/ets/components/imageknife/Downsampling/BaseDownsampling.ets new file mode 100644 index 0000000..62a04a8 --- /dev/null +++ b/library/src/main/ets/components/imageknife/Downsampling/BaseDownsampling.ets @@ -0,0 +1,26 @@ +/* + * 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 { lang } from '@kit.ArkTS'; + +type ISendable = lang.ISendable; + +export interface BaseDownsampling extends ISendable { + getName(): string + + getScaleFactor(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number + + getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number +} \ No newline at end of file diff --git a/library/src/main/ets/components/imageknife/Downsampling/DownsampleStartegy.ets b/library/src/main/ets/components/imageknife/Downsampling/DownsampleStartegy.ets new file mode 100644 index 0000000..3c9614a --- /dev/null +++ b/library/src/main/ets/components/imageknife/Downsampling/DownsampleStartegy.ets @@ -0,0 +1,144 @@ +/* + * 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 { BaseDownsampling } from './BaseDownsampling' + +@Sendable +export class CenterInside { + getName() { + return "CenterInside" + } + + getScaleFactor(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number { + return Math.min(1, this.getScale(sourceWidth, sourceHeight, requestWidth, requestHeight)) + } + + getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number { + return 1 + } + + getScale(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number { + let widthPercentage = requestWidth / sourceWidth + let heightPercentage = requestHeight / sourceHeight + return Math.min(widthPercentage, heightPercentage) + } +} + +/*不进行下采样*/ +@Sendable +export class DownsampleNone implements BaseDownsampling { + getName() { + return "DownsampleNone" + } + + getScaleFactor(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number { + return 1 + } + + getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number { + return 1 + } +} + +/* 下采样使得图像的组大尺寸在给定的尺寸的1/2之间*/ +@Sendable +export class AtMost implements BaseDownsampling { + getName() { + return "AtMost" + } + + getScaleFactor(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number { + let maxIntegerFactor = Math.ceil(Math.max(sourceHeight / requestHeight, sourceWidth / requestWidth)); + let lesserOrEqualSampleSize = Math.max(1, this.highestOneBit(maxIntegerFactor)) + let greaterOrEqualSampleSize = lesserOrEqualSampleSize << (lesserOrEqualSampleSize < maxIntegerFactor ? 1 : 0) + return 1 / greaterOrEqualSampleSize + } + + getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number { + return 0 + } + + highestOneBit(i: number): number { + i |= (i >> 1); + i |= (i >> 2); + i |= (i >> 4); + i |= (i >> 8); + i |= (i >> 16); + return i - (i >>> 1); + } +} + +@Sendable +export class Atleast implements BaseDownsampling { + getName() { + return "Atleast" + } + + getScaleFactor(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number { + let minIntegerFactor = Math.floor(Math.min(sourceHeight / requestHeight, sourceWidth / requestWidth)) + return minIntegerFactor == 0 ? 1 : 1 / this.highestOneBit(minIntegerFactor) + } + + getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number { + return 1 + } + + highestOneBit(i: number): number { + i |= (i >> 1); + i |= (i >> 2); + i |= (i >> 4); + i |= (i >> 8); + i |= (i >> 16); + return i - (i >>> 1); + } +} + +@Sendable +export class CenterOutside implements BaseDownsampling { + getName() { + return "CenterOutside" + } + + getScaleFactor(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number { + let widthPercentage = requestWidth / sourceWidth + let heightPercentage = requestHeight / sourceHeight + return Math.max(widthPercentage, heightPercentage) + } + + getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number { + return 1 + } +} + +@Sendable +export class FitCenter { + getName() { + return "FitCenter" + } + + getScaleFactor(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number { + let widthPercentage = requestWidth / sourceWidth + let heightPercentage = requestHeight / sourceHeight + return Math.min(widthPercentage, heightPercentage) + } + + getSampleSizeRounding(sourceWidth: number, sourceHeight: number, requestWidth: number, requestHeight: number): number { + return 1 + } +} + +export enum SampleSizeRounding { + MEMORY, + QUALITY +} \ No newline at end of file diff --git a/library/src/main/ets/components/imageknife/Downsampling/Downsampler.ets b/library/src/main/ets/components/imageknife/Downsampling/Downsampler.ets new file mode 100644 index 0000000..8444788 --- /dev/null +++ b/library/src/main/ets/components/imageknife/Downsampling/Downsampler.ets @@ -0,0 +1,134 @@ +/* + * 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 { RequestOption } from '../RequestOption'; +import { FileTypeUtil } from '../utils/FileTypeUtil'; +import { CenterOutside, FitCenter, SampleSizeRounding } from './DownsampleStartegy'; + +let TAG = 'downsampling' + +export class Downsampler { + calculateScaling( + imageType: ArrayBuffer, + sourceHeight: number, + sourceWidth: number, + request?: RequestOption + ): ESObject { + const fileType: string | null = new FileTypeUtil().getFileType(imageType) + let powerOfTwoWidth: number | null = null; + let powerOfTwoHeight: number | null = null; + let targetWidth: number = 0 + let targetHeight: number = 0 + if (request?.size.width && !request?.size.height) { + targetWidth = this.round((request?.size.height) * sourceWidth / sourceHeight) + } else if (request?.size.height && !request?.size.width) { + targetHeight = this.round((request?.size.width) * sourceHeight / sourceWidth) + } else if (request?.size.height && request?.size.width) { + targetHeight = request.size.height; + targetWidth = request?.size.width; + } else { + throw new Error("Cannot found width or height "); + } + if (sourceWidth <= 0 || sourceHeight <= 0) return; + let orientedSourceWidth = sourceWidth; + let orientedSourceHeight = sourceHeight; + if (this.isRotationRequired(90)) { + orientedSourceWidth = sourceHeight; + orientedSourceHeight = sourceWidth; + } + /*安卓的模式*/ + let exactScaleFactor: number = new FitCenter() + .getScaleFactor(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight) + if (exactScaleFactor <= 0) { + throw new Error("Cannot round with exactScaleFactor"); + } + /*安卓的模式*/ + let rounding: SampleSizeRounding = new FitCenter() + .getSampleSizeRounding(orientedSourceWidth, orientedSourceHeight, targetWidth, targetHeight) + if (rounding == null) { + throw new Error("Cannot round with null rounding"); + } + let outWidth: number = this.round(exactScaleFactor * orientedSourceWidth); + let outHeight: number = this.round(exactScaleFactor * orientedSourceHeight); + let widthScaleFactor = Math.floor(orientedSourceWidth / outWidth); + let heightScaleFactor = Math.floor(orientedSourceHeight / outHeight); + let scaleFactor = rounding == SampleSizeRounding.MEMORY ? + Math.max(widthScaleFactor, heightScaleFactor) : + Math.min(widthScaleFactor, heightScaleFactor) + // 将整型的缩放因子转换为2的次幂采样大小 + let powerOfTwoSampleSize: number = 0; + powerOfTwoSampleSize = Math.max(1, this.highestOneBit(scaleFactor)) + if (rounding == SampleSizeRounding.MEMORY && powerOfTwoSampleSize < (1 / exactScaleFactor)) { + powerOfTwoSampleSize = powerOfTwoSampleSize << 1; + } + // 基于上一步得出的采样大小,根据不同的图片类型，计算采样后的图片尺寸 + if (fileType == "jpeg") { + let nativeScaling = Math.min(powerOfTwoSampleSize, 8); + powerOfTwoWidth = Math.ceil(orientedSourceWidth / nativeScaling); + powerOfTwoHeight = Math.ceil(orientedSourceHeight / nativeScaling); + let secondaryScaling = Math.floor(powerOfTwoSampleSize / 8); + if (secondaryScaling > 0) { + powerOfTwoWidth = powerOfTwoWidth / secondaryScaling; + powerOfTwoHeight = powerOfTwoHeight / secondaryScaling; + } + } else if (fileType == "png") { + powerOfTwoWidth = Math.floor(orientedSourceWidth / powerOfTwoSampleSize); + powerOfTwoHeight = Math.floor(orientedSourceHeight / powerOfTwoSampleSize); + } else if (fileType == "webp") { + powerOfTwoWidth = Math.round(orientedSourceWidth / powerOfTwoSampleSize); + powerOfTwoHeight = Math.round(orientedSourceHeight / powerOfTwoSampleSize); + } else if (orientedSourceWidth % powerOfTwoSampleSize != 0 || orientedSourceHeight % powerOfTwoSampleSize != 0) { + + } else { + powerOfTwoWidth = orientedSourceWidth / powerOfTwoSampleSize; + powerOfTwoHeight = orientedSourceHeight / powerOfTwoSampleSize; + } + let a: ESObject = { "targetWidth": powerOfTwoWidth, "targetHeight": powerOfTwoHeight } + return a + } + + highestOneBit(i: number): number { + i |= (i >> 1); + i |= (i >> 2); + i |= (i >> 4); + i |= (i >> 8); + i |= (i >> 16); + return i - (i >>> 1); + } + + round(value: number): number { + return Math.floor(value + 0.5); + } + + isRotationRequired(degreesToRotate: number): boolean { + return degreesToRotate == 90 || degreesToRotate == 270; + } + + // isScaling(options: ESObject): boolean { + // return options.inTargetDensity >0 + // && options.inDensity>0 + // && options.inTargetDensity != options.inDensity; + //} + getDensityMultiplier(adjustedScaleFactor: number): number { + return Math.round(Number.MAX_VALUE * (adjustedScaleFactor <= 1 ? adjustedScaleFactor : 1 / adjustedScaleFactor)); + } + + adjustTargetDensityForError(adjustedScaleFactor: number): number { + let densityMultiplier = this.getDensityMultiplier(adjustedScaleFactor); + let targetDensity = this.round(densityMultiplier * adjustedScaleFactor); + let scaleFactorWithError = targetDensity / densityMultiplier; + let difference = adjustedScaleFactor / scaleFactorWithError; + return this.round(difference * targetDensity); + } +} \ No newline at end of file diff --git a/library/src/main/ets/components/imageknife/ImageKnife.ets b/library/src/main/ets/components/imageknife/ImageKnife.ets index 3f91422..ac4bac1 100644 --- a/library/src/main/ets/components/imageknife/ImageKnife.ets +++ b/library/src/main/ets/components/imageknife/ImageKnife.ets @@ -567,6 +567,7 @@ export class ImageKnife { data.setDiskMemoryCachePath(this.diskMemoryCache.getPath()) data.setPlaceHolderRegisterCacheKey(request.placeholderRegisterCacheKey); data.setPlaceHolderRegisterMemoryCacheKey(request.placeholderRegisterMemoryCacheKey); + data.setDownsampType(request.downsampType) return data; } @@ -843,7 +844,7 @@ async function taskExecute(sendData:SendableData,taskData:TaskParams): Promise

| undefined = undefined; @@ -511,6 +514,10 @@ export class RequestOption { this.gpuEnabled = true; return this; } + downsampleOf(downsampType: ESObject){ + this.downsampType = downsampType + return this; + } // 占位图解析成功 placeholderOnComplete = (imageKnifeData:ImageKnifeData) => { diff --git a/library/src/main/ets/components/imageknife/SendableData.ets b/library/src/main/ets/components/imageknife/SendableData.ets index c910e86..fb5c24e 100644 --- a/library/src/main/ets/components/imageknife/SendableData.ets +++ b/library/src/main/ets/components/imageknife/SendableData.ets @@ -18,7 +18,8 @@ import { collections } from '@kit.ArkTS'; import { IDataFetch } from './networkmanage/IDataFetch'; import { DiskLruCache } from '../cache/DiskLruCache'; import { DownloadClient } from './networkmanage/DownloadClient'; - +import { BaseDownsampling } from './Downsampling/BaseDownsampling'; +import { DownsampleNone } from './Downsampling/DownsampleStartegy'; @Sendable export class SendableData{ @@ -41,6 +42,7 @@ export class SendableData{ private dataFetch: IDataFetch = new DownloadClient(); private placeholderRegisterCacheKey: string = ""; private placeholderRegisterMemoryCacheKey: string = ""; + private downsampType: BaseDownsampling = new DownsampleNone(); public setDataFetch(value: IDataFetch) { this.dataFetch = value; @@ -194,4 +196,11 @@ export class SendableData{ public getPlaceHolderRegisterMemoryCacheKey(): string { return this.placeholderRegisterMemoryCacheKey; } + public setDownsampType(Type: BaseDownsampling): BaseDownsampling{ + return this.downsampType = Type; + } + + public getDownsampType(): BaseDownsampling { + return this.downsampType; + } } \ No newline at end of file diff --git a/library/src/main/ets/components/imageknife/interface/IParseImage.ets b/library/src/main/ets/components/imageknife/interface/IParseImage.ets index 9713810..3fd1d82 100644 --- a/library/src/main/ets/components/imageknife/interface/IParseImage.ets +++ b/library/src/main/ets/components/imageknife/interface/IParseImage.ets @@ -13,8 +13,9 @@ * limitations under the License. */ import { BusinessError } from '@ohos.base' +import { RequestOption } from '../RequestOption'; export interface IParseImage { - parseImage:(imageinfo:ArrayBuffer, onCompleteFunction:(value:T)=>void | PromiseLike, onErrorFunction:(reason?:BusinessError|string)=>void)=>void; + parseImage:(imageinfo:ArrayBuffer, onCompleteFunction:(value:T)=>void | PromiseLike, onErrorFunction:(reason?:BusinessError|string)=>void,request?:RequestOption)=>void; parseImageThumbnail:(scale:number, imageinfo:ArrayBuffer, onCompleteFunction:(value:T)=>void | PromiseLike, onErrorFunction:(reason?:BusinessError|string)=>void)=>void; } \ No newline at end of file diff --git a/library/src/main/ets/components/imageknife/requestmanage/RequestManager.ets b/library/src/main/ets/components/imageknife/requestmanage/RequestManager.ets index a415276..294e278 100644 --- a/library/src/main/ets/components/imageknife/requestmanage/RequestManager.ets +++ b/library/src/main/ets/components/imageknife/requestmanage/RequestManager.ets @@ -167,7 +167,7 @@ export class RequestManager { // gif、webp处理 if ((ImageKnifeData.GIF == typeValue || ImageKnifeData.WEBP == typeValue) && !request.dontAnimateFlag) { // 处理gif、webp - this.gifProcess(onComplete, onError, arrayBuffer, typeValue) + this.gifProcess(onComplete, onError, arrayBuffer, typeValue,request) } else if (ImageKnifeData.SVG == typeValue) { // 处理svg this.svgProcess(request, onComplete, onError, arrayBuffer, typeValue) @@ -188,7 +188,7 @@ export class RequestManager { let success = (value: PixelMap) => { onComplete(value); } - this.mParseImageUtil.parseImage(arrayBuffer, success, onError) + this.mParseImageUtil.parseImage(arrayBuffer, success, onError,request) } } } @@ -266,7 +266,7 @@ export class RequestManager { // 解析磁盘文件 gif、webp 和 svg if ((ImageKnifeData.GIF == typeValue || ImageKnifeData.WEBP == typeValue) && !request.dontAnimateFlag) { // 处理gif、webp - this.gifProcess(onComplete, onError, source, typeValue) + this.gifProcess(onComplete, onError, source, typeValue,request) } else if (ImageKnifeData.SVG == typeValue) { this.svgProcess(request, onComplete, onError, source, typeValue) } else { @@ -331,13 +331,13 @@ export class RequestManager { let success = (value: PixelMap) => { onComplete(value); } - this.mParseImageUtil.parseImage(source, success, onError) + this.mParseImageUtil.parseImage(source, success, onError,request) }, this.options.thumbDelayTime) } else { let success = (value: PixelMap) => { onComplete(value); } - this.mParseImageUtil.parseImage(source, success, onError) + this.mParseImageUtil.parseImage(source, success, onError,request) } } } @@ -360,13 +360,13 @@ export class RequestManager { let success = (value: PixelMap) => { onComplete(value); } - this.mParseImageUtil.parseImage(source, success, onError) + this.mParseImageUtil.parseImage(source, success, onError,request) }, this.options.thumbDelayTime) } else { let success = (value: PixelMap) => { onComplete(value); } - this.mParseImageUtil.parseImage(source, success, onError) + this.mParseImageUtil.parseImage(source, success, onError,request) } } @@ -396,7 +396,7 @@ export class RequestManager { // 解析磁盘文件 gif、webp 和 svg if ((ImageKnifeData.GIF == filetype || ImageKnifeData.WEBP == filetype) && !this.options.dontAnimateFlag) { // 处理gif、webp - this.gifProcess(onComplete, onError, source, filetype) + this.gifProcess(onComplete, onError, source, filetype,request) // 保存二级磁盘缓存 Promise.resolve(source) @@ -454,7 +454,7 @@ export class RequestManager { this.saveCacheAndDisk(value, filetype, onComplete, source); } } - this.mParseImageUtil.parseImage(source, success, onError) + this.mParseImageUtil.parseImage(source, success, onError,request) }, this.options.thumbDelayTime) } else { let success = (value: PixelMap) => { @@ -462,7 +462,7 @@ export class RequestManager { this.saveCacheAndDisk(value, filetype, onComplete, source); } } - this.mParseImageUtil.parseImage(source, success, onError) + this.mParseImageUtil.parseImage(source, success, onError,request) } } } @@ -534,9 +534,17 @@ export class RequestManager { svgParseImpl.parseSvg(option, arraybuffer, onComplete, onError) } - private gifProcess(onComplete: (value: PixelMap | GIFFrame[]) => void | PromiseLike, onError: (reason?: BusinessError | string) => void, arraybuffer: ArrayBuffer, typeValue: string, cacheStrategy?: (cacheData: ImageKnifeData) => void) { + private gifProcess( + onComplete: (value: PixelMap | GIFFrame[]) => void | PromiseLike, + onError: (reason?: BusinessError | string) => void, + arraybuffer: ArrayBuffer, + typeValue: string, + request?:RequestOption, + cacheStrategy?: (cacheData: ImageKnifeData) => void) { let gifParseImpl = new GIFParseImpl() - gifParseImpl.parseGifs(arraybuffer, (data?: GIFFrame[], err?: BusinessError | string) => { + gifParseImpl.parseGifs( + arraybuffer, + (data?: GIFFrame[], err?: BusinessError | string) => { if (err) { onError(err) } @@ -552,6 +560,6 @@ export class RequestManager { } else { onError('Parse GIF callback data is null, you need check callback data!') } - }) + },request) } } diff --git a/library/src/main/ets/components/imageknife/utils/ParseImageUtil.ets b/library/src/main/ets/components/imageknife/utils/ParseImageUtil.ets index fd3cb98..1168ca4 100644 --- a/library/src/main/ets/components/imageknife/utils/ParseImageUtil.ets +++ b/library/src/main/ets/components/imageknife/utils/ParseImageUtil.ets @@ -16,15 +16,20 @@ import { IParseImage } from '../interface/IParseImage' import image from '@ohos.multimedia.image'; import { BusinessError } from '@ohos.base' -import taskpool from '@ohos.taskpool'; -import { LogUtil } from './LogUtil'; +import { RequestOption } from '../RequestOption'; +import { Downsampler } from '../Downsampling/Downsampler'; export class ParseImageUtil implements IParseImage { - parseImage(imageinfo: ArrayBuffer, onCompleteFunction: (value: PixelMap) => void | PromiseLike, onErrorFunction: (reason?: BusinessError | string) => void) { - this.parseImageThumbnail(1, imageinfo, onCompleteFunction, onErrorFunction) + parseImage( + imageinfo: ArrayBuffer, + onCompleteFunction: (value: PixelMap) => void | PromiseLike, + onErrorFunction: (reason?: BusinessError | string) => void, + request?:RequestOption + ) { + this.parseImageThumbnail(1, imageinfo, onCompleteFunction, onErrorFunction,request) } - parseImageThumbnail(scale: number, imageinfo: ArrayBuffer, onCompleteFunction: (value: PixelMap) => void | PromiseLike, onErrorFunction: (reason?: BusinessError | string) => void) { + parseImageThumbnail(scale: number, imageinfo: ArrayBuffer, onCompleteFunction: (value: PixelMap) => void | PromiseLike, onErrorFunction: (reason?: BusinessError | string) => void,request?:RequestOption) { let imageSource: image.ImageSource = image.createImageSource(imageinfo); // 步骤一：文件转为pixelMap 然后变换 给Image组件 imageSource.getImageInfo().then((value) => { @@ -38,7 +43,16 @@ export class ParseImageUtil implements IParseImage { editable: true, desiredSize: defaultSize }; - + if(request?.downsampType.getName()!==undefined && request?.downsampType.getName()!=='DownsampleNone'){ + const b:ESObject = new Downsampler().calculateScaling(imageinfo, hValue, wValue,request) + opts= { + editable: true, + desiredSize: { + height: b.targetHeight, + width: b.targetWidth + } + }; + } imageSource.createPixelMap(opts).then((pixelMap: image.PixelMap) => { onCompleteFunction(pixelMap); imageSource.release() diff --git a/library/src/main/ets/components/imageknife/utils/gif/GIFParseImpl.ets b/library/src/main/ets/components/imageknife/utils/gif/GIFParseImpl.ets index abe1a37..6bdc0f0 100644 --- a/library/src/main/ets/components/imageknife/utils/gif/GIFParseImpl.ets +++ b/library/src/main/ets/components/imageknife/utils/gif/GIFParseImpl.ets @@ -19,6 +19,8 @@ import { BusinessError } from '@ohos.base' import worker, { ErrorEvent, MessageEvents } from '@ohos.worker'; import taskpool from '@ohos.taskpool' import { LogUtil } from '../LogUtil' +import { RequestOption } from '../../RequestOption' +import { Downsampler } from '../../Downsampling/Downsampler' export interface senderData { type: string, @@ -34,7 +36,11 @@ export interface gifBackData { } export class GIFParseImpl implements IParseGif { - parseGifs(imageinfo: ArrayBuffer, callback: (data?: GIFFrame[], err?: BusinessError | string) => void) { + parseGifs( + imageinfo: ArrayBuffer, + callback: (data?: GIFFrame[], err?: BusinessError | string) => void, + _request?: RequestOption + ) { // 硬解码流程 let imageSource = image.createImageSource(imageinfo); let decodeOpts: image.DecodingOptions = { @@ -42,7 +48,25 @@ export class GIFParseImpl implements IParseGif { editable: true, rotate: 0 } - let data:GIFFrame[] = []; + let hValue: number = 0 + let wValue: number = 0 + imageSource.getImageInfo().then((value) => { + hValue = Math.round(value.size.height); + wValue = Math.round(value.size.height); + if ( _request?.downsampType.getName()!==undefined && _request?.downsampType.getName()!=='DownsampleNone') { + const b: ESObject = new Downsampler().calculateScaling(imageinfo, Math.round(value.size.height), Math.round(value.size.width), _request) + decodeOpts = { + sampleSize: 1, + editable: true, + rotate: 0, + desiredSize: { + width: b.targetWidth, + height: b.targetHeight + } + } + } + }) + let data: GIFFrame[] = []; imageSource.createPixelMapList(decodeOpts).then((pixelList: Array) => { //sdk的api接口发生变更：从.getDelayTime() 变为.getDelayTimeList() imageSource.getDelayTimeList().then(delayTimes => { @@ -60,20 +84,20 @@ export class GIFParseImpl implements IParseGif { } data.push(frame) } - callback(data,undefined) + callback(data, undefined) imageSource.release(); }).catch((err: string) => { imageSource.release(); - callback(undefined,err) + callback(undefined, err) }) } }).catch((err: string) => { imageSource.release(); - callback(undefined,err) + callback(undefined, err) }) }).catch((err: string) => { imageSource.release(); - callback(undefined,err) + callback(undefined, err) }) } } \ No newline at end of file diff --git a/library/src/main/ets/components/imageknife/utils/gif/IParseGif.ets b/library/src/main/ets/components/imageknife/utils/gif/IParseGif.ets index d80f388..d003ea0 100644 --- a/library/src/main/ets/components/imageknife/utils/gif/IParseGif.ets +++ b/library/src/main/ets/components/imageknife/utils/gif/IParseGif.ets @@ -15,7 +15,12 @@ import { BusinessError } from '@ohos.base' import { GIFFrame } from './GIFFrame' import worker from '@ohos.worker'; -export interface IParseGif{ + +export interface IParseGif { // gif解析 - parseGifs:(imageinfo: ArrayBuffer, callback: (data?:GIFFrame[], err?:BusinessError|string) => void, worker?:worker.ThreadWorker,runMainThread?:boolean)=>void + parseGifs: ( + imageinfo: ArrayBuffer, + callback: (data?: GIFFrame[], err?: BusinessError | string) => void, + request: ESObject, + worker?: worker.ThreadWorker, runMainThread?: boolean) => void, } \ No newline at end of file diff --git a/library/src/main/ets/components/imageknife/utils/svg/SVGParseImpl.ets b/library/src/main/ets/components/imageknife/utils/svg/SVGParseImpl.ets index 557214a..e403d55 100644 --- a/library/src/main/ets/components/imageknife/utils/svg/SVGParseImpl.ets +++ b/library/src/main/ets/components/imageknife/utils/svg/SVGParseImpl.ets @@ -17,6 +17,7 @@ import { RequestOption } from '../../RequestOption' import { BusinessError } from '@ohos.base' import { ImageKnifeData, ImageKnifeType } from '../../ImageKnifeData' import image from '@ohos.multimedia.image' +import { Downsampler } from '../../Downsampling/Downsampler' export class SVGParseImpl implements IParseSvg { parseSvg(option: RequestOption, imageInfo: ArrayBuffer, @@ -24,23 +25,35 @@ export class SVGParseImpl implements IParseSvg { onErrorFunction: (reason?: BusinessError | string) => void) { let imageSource: image.ImageSource = image.createImageSource(imageInfo); // 步骤一：文件转为pixelMap 然后变换 给Image组件 - let hValue = Math.round(option.size.height); - let wValue = Math.round(option.size.width); - let defaultSize: image.Size = { - height: hValue, - width: wValue - }; - let opts: image.DecodingOptions = { - editable: true, - desiredSize: defaultSize - }; - imageSource.createPixelMap(opts).then((pixelMap: image.PixelMap) => { - let imageKnifeData = ImageKnifeData.createImagePixelMap(ImageKnifeType.PIXELMAP, pixelMap) - onComplete(imageKnifeData?.drawPixelMap?.imagePixelMap as PixelMap); - imageSource.release() - }).catch((err: string) => { - onErrorFunction(err); - imageSource.release() + imageSource.getImageInfo().then((value) => { + let hValue = Math.round(value.size.height); + let wValue = Math.round(value.size.width); + let defaultSize: image.Size = { + height: hValue, + width: wValue + }; + let opts: image.DecodingOptions = { + editable: true, + desiredSize: defaultSize + }; + if (option?.downsampType.getName()!==undefined && option?.downsampType.getName()!=='DownsampleNone') { + const b: ESObject = new Downsampler().calculateScaling(imageInfo, hValue, wValue, option) + opts = { + editable: true, + desiredSize: { + width: b.targetWidth, + height: b.targetHeight + } + } + } + imageSource.createPixelMap(opts).then((pixelMap: image.PixelMap) => { + let imageKnifeData = ImageKnifeData.createImagePixelMap(ImageKnifeType.PIXELMAP, pixelMap) + onComplete(imageKnifeData?.drawPixelMap?.imagePixelMap as PixelMap); + imageSource.release() + }).catch((err: string) => { + onErrorFunction(err); + imageSource.release() + }) }) } } \ No newline at end of file From ad9d4b11ee7ff06314c7e73aa5719a300114229a Mon Sep 17 00:00:00 2001 From: tsm <2418639820@qq.com> Date: Mon, 6 May 2024 14:40:40 +0800 Subject: [PATCH 2/3] =?UTF-8?q?imageKnife=E9=99=8D=E9=87=87=E6=A0=B7=20?= =?UTF-8?q?=E6=B7=BB=E5=8A=A0Readme?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: tsm <2418639820@qq.com> --- CHANGELOG.md | 1 + README.md | 50 +++++++++++++++++++++++++++----------------------- 2 files changed, 28 insertions(+), 23 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 879860a..d952d21 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,4 +1,5 @@ ## 2.2.0-rc.2 +- ImageKnife支持下采样 - ImageKnife支持heic图片修改demo，按钮控制组件是否展示 - 修复通过磁盘链接加载图片无法显示 - ImageKnife控制可视化区域图片 diff --git a/README.md b/README.md index 3628364..c700f5e 100644 --- a/README.md +++ b/README.md @@ -425,30 +425,32 @@ request.skipMemoryCache(true) ### 图片变换相关 -| 使用方法 | 类型 | 相关描述 | -|--------------------------------|------------------------------------|--------------------------------| -| request.centerCrop() | CenterCrop | 可以根据图片文件，目标显示大小，进行对应centerCrop | +| 使用方法 | 类型 | 相关描述 | +|--------------------------------|------------------------------------|----------------------------------| +| request.centerCrop() | CenterCrop | 可以根据图片文件，目标显示大小，进行对应centerCrop | | request.centerInside() | CenterInside | 可以根据图片文件，目标显示大小，进行对应centerInside | -| request.fitCenter() | FitCenter | 可以根据图片文件，目标显示大小，进行对应fitCenter | -| request.blur() | BlurTransformation | 模糊处理(图片分辨率较大建议传递第二个参数将图片进行缩小) | -| request.brightnessFilter() | BrightnessFilterTransformation | 亮度滤波器 | -| request.contrastFilter() | ContrastFilterTransformation | 对比度滤波器 | -| request.cropCircle() | CropCircleTransformation | 圆形剪裁显示 | -| request.cropCircleWithBorder() | CropCircleWithBorderTransformation | 圆环展示 | -| request.cropSquare() | CropSquareTransformation | 正方形剪裁 | -| request.crop() | CropTransformation | 自定义矩形剪裁 | -| request.grayscale() | GrayscaleTransformation | 灰度级转换 | -| request.invertFilter() | InvertFilterTransformation | 反转滤波器 | -| request.pixelationFilter() | PixelationFilterTransformation | 像素化滤波器 | -| request.rotateImage() | RotateImageTransformation | 图片旋转 | -| request.roundedCorners() | RoundedCornersTransformation | 圆角剪裁 | -| request.sepiaFilter() | SepiaFilterTransformation | 乌墨色滤波器 | -| request.sketchFilter() | SketchFilterTransformation | 素描滤波器 | -| request.mask() | MaskTransformation | 遮罩 | -| request.swirlFilter() | SwirlFilterTransformation | 扭曲滤波器 | -| request.kuwaharaFilter() | KuwaharaFilterTransform | 桑原滤波器 | -| request.toonFilter() | ToonFilterTransform | 动画滤波器 | -| request.vignetteFilter() | VignetteFilterTransform | 装饰滤波器 | +| request.fitCenter() | FitCenter | 可以根据图片文件，目标显示大小，进行对应fitCenter | +| request.blur() | BlurTransformation | 模糊处理(图片分辨率较大建议传递第二个参数将图片进行缩小) | +| request.brightnessFilter() | BrightnessFilterTransformation | 亮度滤波器 | +| request.contrastFilter() | ContrastFilterTransformation | 对比度滤波器 | +| request.cropCircle() | CropCircleTransformation | 圆形剪裁显示 | +| request.cropCircleWithBorder() | CropCircleWithBorderTransformation | 圆环展示 | +| request.cropSquare() | CropSquareTransformation | 正方形剪裁 | +| request.crop() | CropTransformation | 自定义矩形剪裁 | +| request.grayscale() | GrayscaleTransformation | 灰度级转换 | +| request.invertFilter() | InvertFilterTransformation | 反转滤波器 | +| request.pixelationFilter() | PixelationFilterTransformation | 像素化滤波器 | +| request.rotateImage() | RotateImageTransformation | 图片旋转 | +| request.roundedCorners() | RoundedCornersTransformation | 圆角剪裁 | +| request.sepiaFilter() | SepiaFilterTransformation | 乌墨色滤波器 | +| request.sketchFilter() | SketchFilterTransformation | 素描滤波器 | +| request.mask() | MaskTransformation | 遮罩 | +| request.swirlFilter() | SwirlFilterTransformation | 扭曲滤波器 | +| request.kuwaharaFilter() | KuwaharaFilterTransform | 桑原滤波器 | +| request.toonFilter() | ToonFilterTransform | 动画滤波器 | +| request.vignetteFilter() | VignetteFilterTransform | 装饰滤波器 | +| request.downsampleOf() | BaseDownsampling | 下采样 | + @@ -532,6 +534,7 @@ HSP场景适配: - imageknife # imageknife主要内容 - compress # 压缩相关 - constants # 常量相关 + - Downsampling # 下采样相关 - entry # 部分数据结构 - holder # 占位图相关解析 - interface # 接口相关 @@ -560,6 +563,7 @@ HSP场景适配: - basicTestResourceManagerPage.ets # 测试本地资源解析 - compressPage.ets # 压缩页面 - cropImagePage2.ets # 手势裁剪页面 + - DownsamplingPage.ets # 图片下采样测试 - frescoImageTestCasePage.ets # 测试属性动画组件切换 - frescoRetryTestCasePage.ets # 测试ImageKnifeComponent加载失败重试 - svgTestCasePage.ets # 测试svg解析页面 From d43c2f72459f137954eebd94bf65fcfeeef305ba Mon Sep 17 00:00:00 2001 From: tsm <2418639820@qq.com> Date: Mon, 6 May 2024 15:23:01 +0800 Subject: [PATCH 3/3] =?UTF-8?q?ImageKnifeComponent=20=E6=B7=BB=E5=8A=A0=20?= =?UTF-8?q?imageKnife=E9=99=8D=E9=87=87=E6=A0=B7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: tsm <2418639820@qq.com> --- entry/src/main/ets/pages/DownsamplingPage.ets | 6 ++++++ .../imageknife/Downsampling/DownsampleStartegy.ets | 2 +- 2 files changed, 7 insertions(+), 1 deletion(-) diff --git a/entry/src/main/ets/pages/DownsamplingPage.ets b/entry/src/main/ets/pages/DownsamplingPage.ets index 05f2976..4df6654 100644 --- a/entry/src/main/ets/pages/DownsamplingPage.ets +++ b/entry/src/main/ets/pages/DownsamplingPage.ets @@ -165,6 +165,7 @@ struct Index { loadSrc: pngUrl, placeholderSrc: $r('app.media.icon_loading'), errorholderSrc: $r('app.media.icon_failed'), + downsampling: new fitter() } }); Button('svg') @@ -174,6 +175,7 @@ struct Index { loadSrc: svgUrl, placeholderSrc: $r('app.media.icon_loading'), errorholderSrc: $r('app.media.icon_failed'), + downsampling: new fitter() } }); @@ -184,6 +186,7 @@ struct Index { loadSrc: bmpUrl, placeholderSrc: $r('app.media.icon_loading'), errorholderSrc: $r('app.media.icon_failed'), + downsampling: new fitter() } }); Button('jpg') @@ -193,6 +196,7 @@ struct Index { loadSrc: jpgUrl, placeholderSrc: $r('app.media.icon_loading'), errorholderSrc: $r('app.media.icon_failed'), + downsampling: new fitter() } }); Button('gif') @@ -202,6 +206,7 @@ struct Index { loadSrc: gifUrl, placeholderSrc: $r('app.media.icon_loading'), errorholderSrc: $r('app.media.icon_failed'), + downsampling: new fitter() } }); Button('webp') @@ -211,6 +216,7 @@ struct Index { loadSrc: webpUrl, placeholderSrc: $r('app.media.icon_loading'), errorholderSrc: $r('app.media.icon_failed'), + downsampling: new fitter() } }); }.margin({ top: 20, bottom: 20 }) diff --git a/library/src/main/ets/components/imageknife/Downsampling/DownsampleStartegy.ets b/library/src/main/ets/components/imageknife/Downsampling/DownsampleStartegy.ets index 3c9614a..78f0362 100644 --- a/library/src/main/ets/components/imageknife/Downsampling/DownsampleStartegy.ets +++ b/library/src/main/ets/components/imageknife/Downsampling/DownsampleStartegy.ets @@ -122,7 +122,7 @@ export class CenterOutside implements BaseDownsampling { } @Sendable -export class FitCenter { +export class FitCenter implements BaseDownsampling { getName() { return "FitCenter" }