From 08ae90f7e4696392503cd38bb181e5a696432fcc Mon Sep 17 00:00:00 2001 From: liangdazhi Date: Tue, 26 Dec 2023 14:34:05 +0800 Subject: [PATCH 1/2] =?UTF-8?q?canvas=E5=A2=9E=E5=8A=A0=E5=9B=BE=E7=89=87?= =?UTF-8?q?=E6=8A=97=E9=94=AF=E9=BD=BF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: liangdazhi --- .../ets/pages/imageknifeTestCaseIndex.ets | 7 ++ .../pages/testImageAntiAliasingWithPage.ets | 65 +++++++++++++++++++ .../resources/base/profile/main_pages.json | 3 +- .../imageknife/ImageKnifeComponent.ets | 4 ++ 4 files changed, 78 insertions(+), 1 deletion(-) create mode 100644 entry/src/main/ets/pages/testImageAntiAliasingWithPage.ets diff --git a/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets b/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets index 77024bd..78fb9bc 100644 --- a/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets +++ b/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets @@ -286,6 +286,13 @@ struct IndexFunctionDemo { router.pushUrl({ url: "pages/testManyGifLoadWithPage" }); }).margin({ top: 5, left: 3 }) }.width('100%').height(60).backgroundColor(Color.Pink) + Text("测试图片抗锯齿").fontSize(15) + Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { + Button("测试图片抗锯齿") + .onClick(() => { + router.pushUrl({ url: "pages/testImageAntiAliasingWithPage" }); + }).margin({ top: 5, left: 3 }) + }.width('100%').height(60).backgroundColor(Color.Pink) } } .width('100%') diff --git a/entry/src/main/ets/pages/testImageAntiAliasingWithPage.ets b/entry/src/main/ets/pages/testImageAntiAliasingWithPage.ets new file mode 100644 index 0000000..bc9713a --- /dev/null +++ b/entry/src/main/ets/pages/testImageAntiAliasingWithPage.ets @@ -0,0 +1,65 @@ +/* + * Copyright (C) 2021 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' +import {ImageKnifeOption} from '@ohos/libraryimageknife' +import {RotateImageTransformation} from '@ohos/libraryimageknife' +import {RoundedCornersTransformation} from '@ohos/libraryimageknife' + +@Entry +@Component +struct TestImageAntiAliasingWithPage { + @State imageKnifeOption1: ImageKnifeOption = + { + loadSrc: "https://thirdwx.qlogo.cn/mmopen/xxxxx", + + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + }; + @State imageKnifeOption: ImageKnifeOption = + { + loadSrc: "https://hbimg.huabanimg.com/xxxxx", + + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + }; + @State imageKnifeOption3: ImageKnifeOption = + { + loadSrc: "https://hbimg.huabanimg.com/xxxxx", + + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + }; + @State imageKnifeOption4: ImageKnifeOption = + { + loadSrc: "https://hbimg.huabanimg.com/xxxxx", + + placeholderSrc: $r('app.media.icon_loading'), + errorholderSrc: $r('app.media.icon_failed'), + }; + + build() { + Scroll() { + Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { + ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption1 }).width(600).height(600) + Image($r('app.media.icon_failed')) + .width(600).height(600).margin(15) + .overlay('png', { align: Alignment.Bottom, offset: { x: 0, y: 20 } }) + .interpolation(ImageInterpolation.High) + } + } + .width('100%') + .height('100%') + } +} diff --git a/entry/src/main/resources/base/profile/main_pages.json b/entry/src/main/resources/base/profile/main_pages.json index be0efeb..82b2574 100644 --- a/entry/src/main/resources/base/profile/main_pages.json +++ b/entry/src/main/resources/base/profile/main_pages.json @@ -33,6 +33,7 @@ "pages/SignatureTestPage", "pages/hspCacheTestPage", "pages/testManyNetImageLoadWithPage", - "pages/testManyGifLoadWithPage" + "pages/testManyGifLoadWithPage", + "pages/testImageAntiAliasingWithPage" ] } \ No newline at end of file diff --git a/library/src/main/ets/components/imageknife/ImageKnifeComponent.ets b/library/src/main/ets/components/imageknife/ImageKnifeComponent.ets index 5a55812..0ac6b28 100644 --- a/library/src/main/ets/components/imageknife/ImageKnifeComponent.ets +++ b/library/src/main/ets/components/imageknife/ImageKnifeComponent.ets @@ -115,6 +115,10 @@ export struct ImageKnifeComponent { } }) .onReady(() => { + let ctx = this.context + ctx.imageSmoothingEnabled = true + ctx.imageSmoothingQuality = 'high' + this.canvasHasReady = true; if (this.onReadyNext) { LogUtil.log('ImageKnifeComponent onReadyNext is running!') From 607156887ae4a739eeea588695643326a1a5bc27 Mon Sep 17 00:00:00 2001 From: zourenjie Date: Tue, 26 Dec 2023 17:32:14 +0800 Subject: [PATCH 2/2] =?UTF-8?q?canvas=E5=A2=9E=E5=8A=A0=E5=9B=BE=E7=89=87?= =?UTF-8?q?=E6=8A=97=E9=94=AF=E9=BD=BF-=E4=BB=A3=E7=A0=81=E6=A0=BC?= =?UTF-8?q?=E5=BC=8F=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: zourenjie --- .../main/ets/pages/imageknifeTestCaseIndex.ets | 6 +++--- .../ets/pages/testImageAntiAliasingWithPage.ets | 16 +++++++--------- .../imageknife/ImageKnifeComponent.ets | 7 +++---- 3 files changed, 13 insertions(+), 16 deletions(-) diff --git a/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets b/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets index 78fb9bc..448e170 100644 --- a/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets +++ b/entry/src/main/ets/pages/imageknifeTestCaseIndex.ets @@ -286,11 +286,11 @@ struct IndexFunctionDemo { router.pushUrl({ url: "pages/testManyGifLoadWithPage" }); }).margin({ top: 5, left: 3 }) }.width('100%').height(60).backgroundColor(Color.Pink) - Text("测试图片抗锯齿").fontSize(15) + Text('测试图片抗锯齿').fontSize(15) Flex({ direction: FlexDirection.Row, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { - Button("测试图片抗锯齿") + Button('测试图片抗锯齿') .onClick(() => { - router.pushUrl({ url: "pages/testImageAntiAliasingWithPage" }); + router.pushUrl({ url: 'pages/testImageAntiAliasingWithPage' }); }).margin({ top: 5, left: 3 }) }.width('100%').height(60).backgroundColor(Color.Pink) } diff --git a/entry/src/main/ets/pages/testImageAntiAliasingWithPage.ets b/entry/src/main/ets/pages/testImageAntiAliasingWithPage.ets index bc9713a..823b7fa 100644 --- a/entry/src/main/ets/pages/testImageAntiAliasingWithPage.ets +++ b/entry/src/main/ets/pages/testImageAntiAliasingWithPage.ets @@ -12,10 +12,10 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -import {ImageKnifeComponent} from '@ohos/libraryimageknife' -import {ImageKnifeOption} from '@ohos/libraryimageknife' -import {RotateImageTransformation} from '@ohos/libraryimageknife' -import {RoundedCornersTransformation} from '@ohos/libraryimageknife' +import { ImageKnifeComponent } from '@ohos/libraryimageknife' +import { ImageKnifeOption } from '@ohos/libraryimageknife' +import { RotateImageTransformation } from '@ohos/libraryimageknife' +import { RoundedCornersTransformation } from '@ohos/libraryimageknife' @Entry @Component @@ -23,28 +23,24 @@ struct TestImageAntiAliasingWithPage { @State imageKnifeOption1: ImageKnifeOption = { loadSrc: "https://thirdwx.qlogo.cn/mmopen/xxxxx", - placeholderSrc: $r('app.media.icon_loading'), errorholderSrc: $r('app.media.icon_failed'), }; @State imageKnifeOption: ImageKnifeOption = { loadSrc: "https://hbimg.huabanimg.com/xxxxx", - placeholderSrc: $r('app.media.icon_loading'), errorholderSrc: $r('app.media.icon_failed'), }; @State imageKnifeOption3: ImageKnifeOption = { loadSrc: "https://hbimg.huabanimg.com/xxxxx", - placeholderSrc: $r('app.media.icon_loading'), errorholderSrc: $r('app.media.icon_failed'), }; @State imageKnifeOption4: ImageKnifeOption = { loadSrc: "https://hbimg.huabanimg.com/xxxxx", - placeholderSrc: $r('app.media.icon_loading'), errorholderSrc: $r('app.media.icon_failed'), }; @@ -54,7 +50,9 @@ struct TestImageAntiAliasingWithPage { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption1 }).width(600).height(600) Image($r('app.media.icon_failed')) - .width(600).height(600).margin(15) + .width(600) + .height(600) + .margin(15) .overlay('png', { align: Alignment.Bottom, offset: { x: 0, y: 20 } }) .interpolation(ImageInterpolation.High) } diff --git a/library/src/main/ets/components/imageknife/ImageKnifeComponent.ets b/library/src/main/ets/components/imageknife/ImageKnifeComponent.ets index 0ac6b28..629800e 100644 --- a/library/src/main/ets/components/imageknife/ImageKnifeComponent.ets +++ b/library/src/main/ets/components/imageknife/ImageKnifeComponent.ets @@ -115,10 +115,9 @@ export struct ImageKnifeComponent { } }) .onReady(() => { - let ctx = this.context - ctx.imageSmoothingEnabled = true - ctx.imageSmoothingQuality = 'high' - + let ctx = this.context; + ctx.imageSmoothingEnabled = true; + ctx.imageSmoothingQuality = 'high'; this.canvasHasReady = true; if (this.onReadyNext) { LogUtil.log('ImageKnifeComponent onReadyNext is running!')