forked from floraachy/ImageKnife
114 lines
4.2 KiB
Plaintext
114 lines
4.2 KiB
Plaintext
/*
|
||
* 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"
|
||
import matrix4 from '@ohos.matrix4'
|
||
|
||
@Entry
|
||
@Component
|
||
struct LoadStatePage {
|
||
|
||
starTime:number = new Date().getTime()
|
||
|
||
@State ImageKnifeOption: ImageKnifeOption = {
|
||
loadSrc: $r("app.media.rabbit"),
|
||
placeholderSrc: $r("app.media.loading"),
|
||
errorholderSrc: $r("app.media.app_icon"),
|
||
objectFit: ImageFit.Contain,
|
||
onLoadListener: {
|
||
onLoadFailed: (err) => {
|
||
console.error("Load Failed Reason: " + err);
|
||
},
|
||
onLoadSuccess: (data) => {
|
||
return data;
|
||
},
|
||
},
|
||
border: { radius: 50 }
|
||
}
|
||
@State imageKnifeOption1: ImageKnifeOption = {
|
||
loadSrc: $r('app.media.startIcon')
|
||
}
|
||
@State message: string = ""
|
||
@State currentWidth: number = 200
|
||
@State currentHeight: number = 200
|
||
@State typeValue: string = ""
|
||
build() {
|
||
Column() {
|
||
Text('测试失败场景请先关闭网络，并保证本地没有此网络图片的缓存')
|
||
.margin({ top: 20 })
|
||
Row() {
|
||
Button('测试失败/成功场景')
|
||
.onClick(() => {
|
||
this.ImageKnifeOption = {
|
||
loadSrc: "https://www.openharmony.cn/_nuxt/img/logo.dcf95b3.png",
|
||
placeholderSrc: $r("app.media.loading"),
|
||
errorholderSrc: $r("app.media.app_icon"),
|
||
objectFit: ImageFit.Contain,
|
||
onLoadListener: {
|
||
onLoadStart:()=>{
|
||
this.starTime = new Date().getTime()
|
||
console.info("Load start: ");
|
||
},
|
||
onLoadFailed: (err) => {
|
||
console.error("Load Failed Reason: " + err + " cost " + (new Date().getTime() - this.starTime) + " milliseconds");
|
||
},
|
||
onLoadSuccess: (data,imageData) => {
|
||
console.info("Load Successful: cost " + (new Date().getTime() - this.starTime) + " milliseconds");
|
||
this.currentWidth = imageData.imageWidth!
|
||
this.currentHeight = imageData.imageHeight!
|
||
this.typeValue = imageData.type!
|
||
return data;
|
||
},
|
||
},
|
||
border: { radius: 50 },
|
||
onComplete:(event)=>{
|
||
console.error("Load onComplete width:"+event?.width , " height:"+event?.height , " componentWidth:"+event?.componentWidth," componentHeight:" + event?.componentHeight);
|
||
}
|
||
}
|
||
})
|
||
}
|
||
.margin({ top: 20 })
|
||
Text(this.typeValue)
|
||
ImageKnifeComponent({ imageKnifeOption: this.ImageKnifeOption }).height(this.currentHeight).width(this.currentWidth)
|
||
.margin({ top: 20 })
|
||
Button("自定义下载失败").onClick(()=>{
|
||
this.imageKnifeOption1 = {
|
||
loadSrc: "abc",
|
||
placeholderSrc:$r('app.media.loading'),
|
||
errorholderSrc:$r('app.media.failed'),
|
||
customGetImage:custom,
|
||
onLoadListener: {
|
||
onLoadFailed:(err)=>{
|
||
this.message = "err:" + err
|
||
}
|
||
}
|
||
}
|
||
}).margin({ top: 20 })
|
||
Text(this.message).fontSize(20).margin({ top: 20 })
|
||
ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption1 }).height(this.currentHeight).width(this.currentWidth)
|
||
.margin({ top: 20 })
|
||
}
|
||
|
||
.width('100%')
|
||
.height('100%')
|
||
}
|
||
|
||
}
|
||
// 自定义下载方法
|
||
@Concurrent
|
||
async function custom(context: Context, src: string | PixelMap | Resource): Promise<ArrayBuffer | undefined> {
|
||
console.info("ImageKnife:: custom download：" + src)
|
||
// 举例写死从本地文件读取，也可以自己请求网络图片
|
||
return undefined
|
||
} |