forked from floraachy/ImageKnife
优化整理imageknifecomponent代码
Signed-off-by: Madixin <madixin@huawei.com>
This commit is contained in:
Madixin
parent
b3114dd47b
commit
587d35f085
|
|
@ -67,6 +67,7 @@ export class ImageKnifeDispatcher {
|
|||
|
||||
|
||||
if (memoryCache !== undefined) {
|
||||
LogUtil.log("ImageKnife_DataTime_showFromMemomry.end_true:" + request.imageKnifeOption.loadSrc)
|
||||
// 画主图
|
||||
if (request.requestState === ImageKnifeRequestState.PROGRESS) {
|
||||
// 回调请求开始
|
||||
|
|
@ -89,7 +90,6 @@ export class ImageKnifeDispatcher {
|
|||
request.requestState = ImageKnifeRequestState.ERROR
|
||||
}
|
||||
}
|
||||
LogUtil.log("ImageKnife_DataTime_showFromMemomry.end_true:" + request.imageKnifeOption.loadSrc)
|
||||
return true
|
||||
}
|
||||
LogUtil.log("ImageKnife_DataTime_showFromMemomry.end_false:" + request.imageKnifeOption.loadSrc)
|
||||
|
|
|
|||
|
|
@ -36,52 +36,62 @@ export struct ImageKnifeComponent {
|
|||
private componentVersion: number = 0
|
||||
private currentContext: common.UIAbilityContext | undefined = undefined
|
||||
@Param imageKnifeOption: ImageKnifeOption = new ImageKnifeOption();
|
||||
|
||||
@Monitor('imageKnifeOption',
|
||||
"imageKnifeOption.loadSrc","imageKnifeOption.signature","imageKnifeOption.transformation","imageKnifeOption.border","imageKnifeOption.objectFit")
|
||||
watchImageKnifeOption() {
|
||||
if (this.request !== undefined) {
|
||||
this.request.requestState = ImageKnifeRequestState.DESTROY
|
||||
}
|
||||
this.request = undefined
|
||||
this.clearLastRequest()
|
||||
this.componentVersion++
|
||||
this.objectFit = this.imageKnifeOption.objectFit === undefined ? ImageFit.Contain : this.imageKnifeOption.objectFit
|
||||
LogUtil.log("watchImageKnifeOption execute request:width=" + this.currentWidth + " height= " + this.currentHeight
|
||||
+ " loadSrc = " + this.request?.imageKnifeOption.loadSrc
|
||||
+ " placeholderSrc = " + this.request?.imageKnifeOption.placeholderSrc
|
||||
+ " errorholderSrc = " + this.request?.imageKnifeOption.errorholderSrc)
|
||||
ImageKnife.getInstance().execute(this.getRequest(this.currentWidth, this.currentHeight))
|
||||
}
|
||||
|
||||
aboutToAppear(): void {
|
||||
//闪动问题失效，注释相应代码后续修复
|
||||
if(this.syncLoad) {
|
||||
this.objectFit = this.imageKnifeOption.objectFit === undefined ? ImageFit.Contain : this.imageKnifeOption.objectFit
|
||||
|
||||
if(this.syncLoad) { //针对部分消息列表最新消息的图片闪动问题，建议使用同步方式在aboutToAppear时加载图片
|
||||
let engineKey: IEngineKey = new DefaultEngineKey();
|
||||
let memoryCacheSrc: ImageKnifeData | undefined = ImageKnife.getInstance()
|
||||
.loadFromMemoryCache(engineKey.generateMemoryKey(this.imageKnifeOption.loadSrc,ImageKnifeRequestSource.SRC,this.imageKnifeOption))
|
||||
if (memoryCacheSrc !== undefined){
|
||||
LogUtil.log("aboutToAppear load from memory cache for key = "+ engineKey.generateMemoryKey(this.imageKnifeOption.loadSrc,ImageKnifeRequestSource.SRC,this.imageKnifeOption))
|
||||
//画主图
|
||||
LogUtil.log("aboutToAppear success load loadSrc from memory cache for loadSrc = "+ this.imageKnifeOption.loadSrc)
|
||||
this.pixelMap = memoryCacheSrc.source;
|
||||
}else {
|
||||
}else{
|
||||
LogUtil.log("aboutToAppear fail load loadSrc from memory cache for loadSrc = "+ this.imageKnifeOption.loadSrc)
|
||||
if (this.imageKnifeOption.placeholderSrc !== undefined){
|
||||
let memoryCachePlace: ImageKnifeData | undefined = ImageKnife.getInstance()
|
||||
.loadFromMemoryCache(engineKey.generateMemoryKey(this.imageKnifeOption.placeholderSrc!,ImageKnifeRequestSource.PLACE_HOLDER,this.imageKnifeOption))
|
||||
if (memoryCachePlace !== undefined){
|
||||
LogUtil.log("aboutToAppear load from memory cache for key = "+ engineKey.generateMemoryKey(this.imageKnifeOption.loadSrc,ImageKnifeRequestSource.SRC,this.imageKnifeOption))
|
||||
//画主图
|
||||
LogUtil.log("aboutToAppear success load placeholderSrc from memory cache for placeholderSrc = " + this.imageKnifeOption.placeholderSrc)
|
||||
this.pixelMap = memoryCachePlace.source;
|
||||
}else{
|
||||
LogUtil.log("aboutToAppear fail load placeholderSrc from memory cache for placeholderSrc = " + this.imageKnifeOption.placeholderSrc)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
this.objectFit = this.imageKnifeOption.objectFit === undefined ? ImageFit.Contain : this.imageKnifeOption.objectFit
|
||||
}
|
||||
|
||||
aboutToDisappear(): void {
|
||||
if (this.request !== undefined) {
|
||||
this.request.requestState = ImageKnifeRequestState.DESTROY
|
||||
this.request = undefined
|
||||
}
|
||||
this.clearLastRequest()
|
||||
}
|
||||
|
||||
aboutToRecycle() {
|
||||
this.clearLastRequest()
|
||||
}
|
||||
|
||||
/**
|
||||
* 对已DESTROY的组件不再发起请求
|
||||
*/
|
||||
private clearLastRequest(){
|
||||
if (this.request !== undefined) {
|
||||
this.request.requestState = ImageKnifeRequestState.DESTROY
|
||||
this.request = undefined
|
||||
}
|
||||
this.objectFit = this.imageKnifeOption.objectFit === undefined ? ImageFit.Contain : this.imageKnifeOption.objectFit
|
||||
}
|
||||
|
||||
build() {
|
||||
|
|
@ -99,15 +109,16 @@ export struct ImageKnifeComponent {
|
|||
this.currentHeight = newValue.height as number
|
||||
this.lastWidth = oldValue.width as number
|
||||
this.lastHeight = oldValue.height as number
|
||||
if (this.currentWidth <= 0 || this.currentHeight <= 0) {
|
||||
// 存在宽或者高为0,此次重回无意义,无需进行request请求
|
||||
} else {
|
||||
// 前提：宽高值均有效,值>0. 条件1：当前宽高与上一次宽高不同 条件2:当前是第一次绘制
|
||||
if (this.currentHeight != this.lastHeight || this.currentWidth != this.lastWidth) {
|
||||
LogUtil.log("execute request:width=" + this.currentWidth + " height= " + this.currentHeight)
|
||||
|
||||
// 条件1: 宽高值均有效,值>0. 条件2：当前宽高与上一次宽高不同
|
||||
if (this.currentWidth > 0 && this.currentHeight > 0 &&
|
||||
(this.currentHeight != this.lastHeight || this.currentWidth != this.lastWidth)) {
|
||||
LogUtil.log("onSizeChange execute request:width=" + this.currentWidth + " height= " + this.currentHeight
|
||||
+ " loadSrc = " + this.request?.imageKnifeOption.loadSrc
|
||||
+ " placeholderSrc = " + this.request?.imageKnifeOption.placeholderSrc
|
||||
+ " errorholderSrc = " + this.request?.imageKnifeOption.errorholderSrc)
|
||||
ImageKnife.getInstance().execute(this.getRequest(this.currentWidth, this.currentHeight))
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
|
@ -132,24 +143,10 @@ export struct ImageKnifeComponent {
|
|||
return //针对reuse场景，不显示历史图片
|
||||
}
|
||||
this.pixelMap = pixelMap
|
||||
if (typeof this.pixelMap !== 'string') {
|
||||
if (this.imageKnifeOption.objectFit === ImageFit.Auto) {
|
||||
if (typeof this.pixelMap !== 'string' && this.imageKnifeOption.objectFit === ImageFit.Auto) { //针对静态图高度自适应
|
||||
let info = await this.pixelMap.getImageInfo()
|
||||
|
||||
this.adaptiveWidth = this.currentWidth
|
||||
this.adaptiveHeight = info.size.height * this.currentWidth / info.size.width
|
||||
|
||||
// if (this.currentWidth / this.currentHeight > info.size.width / info.size.height) {
|
||||
// this.adaptiveWidth = this.currentWidth
|
||||
// this.adaptiveHeight = info.size.height * this.currentWidth / this.currentHeight
|
||||
// }
|
||||
// else {
|
||||
// this.adaptiveWidth = info.size.width * this.currentWidth / this.currentHeight
|
||||
// this.adaptiveHeight = this.currentHeight
|
||||
// }
|
||||
}
|
||||
} else {
|
||||
//console.info("KKKKKKKKKKK:" + pixelMap)
|
||||
}
|
||||
|
||||
if (requestSource == ImageKnifeRequestSource.SRC) {
|
||||
|
|
@ -169,7 +166,3 @@ export struct ImageKnifeComponent {
|
|||
return this.request
|
||||
}
|
||||
}
|
||||
|
||||
interface KeyCanvas {
|
||||
keyId: string
|
||||
}
|
||||
Loading…
Reference in New Issue