/*
* Copyright (C) 2026 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 { CacheStrategy, ImageKnife, ImageKnifeComponent } from '@ohos/libraryimageknife';
import { router } from '@kit.ArkUI';
@Entry
@Component
struct CompareJpegPage {
private smallJpeg = "small_jpeg/";
private middleJpeg = "middle_jpeg/";
private bigJpeg = "big_jpeg/";
private currentJpegType = "";
private urlPrefix: string = "https://gitee.com/Keke_planet/test-demos/raw/master/docPic/"
@State private dataArr: Array<string> = []
@State private enableOptimize: boolean = false;
@State private cacheCount: number | undefined = 0;
@State private showPics: boolean = true;
aboutToAppear(): void {
this.updateUrls(this.smallJpeg)
}
updateUrls(type: string) {
ImageKnife.getInstance().removeAllMemoryCache();
this.cacheCount = 0;
let arr: Array<string> = []
for (let i = 1; i <= 9; i++) {
arr.push(this.urlPrefix + type + i + ".jpg")
}
if (type === this.currentJpegType) {
// force to update
this.showPics = false;
setTimeout(() => {
this.dataArr = arr;
this.showPics = true;
}, 100)
} else {
this.dataArr = arr;
}
this.currentJpegType = type;
}
aboutToDisappear(): void {
ImageKnife.getInstance().setJpegOptimizeDecoding(false);
}
build() {
Column() {
Row() {
Button("返回").onClick(() => {
router.back()
}).margin({ left: 10 })
}.width("100%").justifyContent(FlexAlign.Start).margin({ top: 10 })
if (this.showPics) {
Grid() {
ForEach(this.dataArr, (url: string) => {
GridItem() {
ImageKnifeComponent({
imageKnifeOption: {
loadSrc: url,
objectFit: ImageFit.Cover,
border: { width: 1 },
onLoadListener: {
onLoadSuccess: () => {
this.cacheCount = ImageKnife.getInstance().getCurrentCacheSize(CacheStrategy.Memory)
}
}
}
}).width(120).height(150)
}
})
}
}
Text(this.enableOptimize ? "已开启Jpeg解码优化" : "未开启Jpeg解码优化").margin({ top: 10 })
Text("内存缓存占用量:" + this.cacheCount)
Button((this.enableOptimize ? "关闭Jpeg解码优化" : "开启Jpeg解码优化") + " 并重新加载").onClick(() => {
this.enableOptimize = !this.enableOptimize;
ImageKnife.getInstance().setJpegOptimizeDecoding(this.enableOptimize)
this.updateUrls(this.currentJpegType)
}).margin(10)
Button("清空内存缓存,并重新加载jpeg小图").onClick(() => {
this.updateUrls(this.smallJpeg)
}).margin({ bottom: 10 })
Button("清空内存缓存,并重新加载jpeg中图").onClick(() => {
this.updateUrls(this.middleJpeg)
}).margin({ bottom: 10 })
Button("清空内存缓存,并重新加载jpeg大图").onClick(() => {
this.updateUrls(this.bigJpeg)
}).margin({ bottom: 10 })
}.width("100%").height("100%")
}
}