!316 修复Resource类型以及onLoadListener回调和onComplete回调

Merge pull request !316 from zgf/3.x

CHANGELOG.md

@@ -1,3 +1,10 @@
+## 3.0.0-rc.9
+- 修复Resource类型$r(变量无法)加载
+- 成功回调增加图片格式
+- Image组件增加onComplete回调
+- 修复404链接无返回错误信息
+- onLoadListener增加请求取消回调
+
 ## 3.0.0-rc.8
 - svg解码单位改为px
 - 修复预加载接口preLoadCache传ImageKnifeOption失效

entry/src/main/ets/pages/LoadStatePage.ets

@@ -38,6 +38,7 @@ struct LoadStatePage {
   }
   @State currentWidth: number = 200
   @State currentHeight: number = 200
+  @State typeValue: string = ""
   build() {
     Column() {
       Text('测试失败场景请先关闭网络，并保证本地没有此网络图片的缓存')
@@ -58,19 +59,23 @@ struct LoadStatePage {
                 onLoadFailed: (err) => {
                   console.error("Load Failed Reason: " + err + "  cost " + (new Date().getTime() - this.starTime) + " milliseconds");
                 },
-                onLoadSuccess: (data,width,height) => {
+                onLoadSuccess: (data,imageData) => {
                   console.info("Load Successful: cost " + (new Date().getTime() - this.starTime) + " milliseconds");
-                  this.currentWidth = width!
+                  this.currentWidth = imageData.imageWidth!
-                  this.currentHeight = height!
+                  this.currentHeight = imageData.imageHeight!
+                  this.typeValue = imageData.type!
                   return data;
                 },
               },
-              border: { radius: 50 }
+              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 })
 

entry/src/main/ets/pages/SingleImage.ets

@@ -19,6 +19,7 @@ import image from '@ohos.multimedia.image';
 @Entry
 @Component
 struct SingleImage {
+  resource: string = "app.media.svgSample"
   scroller: Scroller = new Scroller;
   localFile: string = getContext(this).filesDir + "/icon.png"
   @State pixelMap:PixelMap | undefined = undefined;
@@ -43,7 +44,7 @@ struct SingleImage {
           .fontWeight(FontWeight.Bold)
         ImageKnifeComponent({
           imageKnifeOption: {
-            loadSrc: $r("app.media.svgSample"),
+            loadSrc: $r(this.resource),
             placeholderSrc: $r("app.media.loading"),
             errorholderSrc: $r("app.media.failed"),
             objectFit: ImageFit.Contain

entry/src/ohosTest/ets/test/ImageKnifeOption.test.ets

@@ -13,7 +13,7 @@
  * limitations under the License.
  */
 import { describe, beforeAll, beforeEach, afterEach, afterAll, it, expect } from '@ohos/hypium';
-import { ImageKnifeOption } from "@ohos/imageknife"
+import { ImageKnifeOption,ImageKnifeData } from "@ohos/imageknife"
 
 export default function ImageKnifeOptionTest() {
   describe('ImageKnifeOptionTest',() => {
@@ -39,22 +39,28 @@ export default function ImageKnifeOptionTest() {
     it('onLoadListener', 0, () => {
       let a = 'abc';
       let b: string = '';
+      let imageData:ImageKnifeData = {
+        source: "",
+        imageWidth: 0,
+        imageHeight: 0,
+      }
       let ImageKnifeOption: ImageKnifeOption = {
         loadSrc: $r("app.media.rabbit"),
         onLoadListener: {
           onLoadFailed: (err) => {
             console.error("Load Failed Reason: " + err);
           },
-          onLoadSuccess: (data) => {
+          onLoadSuccess: (data,imageknifeData) => {
             if(typeof data == 'string') {
               return b = data;
             }
+            imageData = imageknifeData
             return data;
           },
         },
       }
       if (ImageKnifeOption.onLoadListener && ImageKnifeOption.onLoadListener.onLoadSuccess && ImageKnifeOption.onLoadListener.onLoadFailed) {
-        ImageKnifeOption.onLoadListener.onLoadSuccess(a);
+        ImageKnifeOption.onLoadListener.onLoadSuccess(a,imageData);
         ImageKnifeOption.onLoadListener.onLoadFailed(a);
       }
       expect(a).assertEqual(b);

library/oh-package.json5

@@ -14,7 +14,7 @@
   "main": "index.ets",
   "repository": "https://gitee.com/openharmony-tpc/ImageKnife",
   "type": "module",
-  "version": "3.0.0-rc.8",
+  "version": "3.0.0-rc.9",
   "dependencies": {
     "@ohos/gpu_transform": "^1.0.2"
   },

library/src/main/ets/ImageKnifeDispatcher.ets

@@ -82,7 +82,7 @@ export class ImageKnifeDispatcher {
           request.requestState = ImageKnifeRequestState.COMPLETE
           // 回调请求开结束
           if (request.imageKnifeOption.onLoadListener?.onLoadSuccess !== undefined) {
-            request.imageKnifeOption.onLoadListener?.onLoadSuccess(memoryCache.source,memoryCache.imageWidth,memoryCache.imageHeight)
+            request.imageKnifeOption.onLoadListener?.onLoadSuccess(memoryCache.source,memoryCache)
             LogUtil.log("ImageKnife_DataTime_MemoryCache_onLoadSuccess:" + request.imageKnifeOption.loadSrc)
           }
         } else if (requestSource == ImageKnifeRequestSource.ERROR_HOLDER) {
@@ -272,7 +272,8 @@ export class ImageKnifeDispatcher {
     let ImageKnifeData: ImageKnifeData = {
       source: pixelmap!,
       imageWidth: requestJobResult.size == undefined ? 0 : requestJobResult.size.width,
-      imageHeight: requestJobResult.size == undefined ? 0 : requestJobResult.size.height
+      imageHeight: requestJobResult.size == undefined ? 0 : requestJobResult.size.height,
+      type:requestJobResult.type
     };
 
     // 保存内存缓存
@@ -305,12 +306,20 @@ export class ImageKnifeDispatcher {
             if (requestWithSource.request.imageKnifeOption.onLoadListener &&
             requestWithSource.request.imageKnifeOption.onLoadListener.onLoadSuccess) {
               // 回调请求成功
-              requestWithSource.request.imageKnifeOption.onLoadListener.onLoadSuccess(ImageKnifeData.source,ImageKnifeData.imageWidth,ImageKnifeData.imageHeight);
+              requestWithSource.request.imageKnifeOption.onLoadListener.onLoadSuccess(ImageKnifeData.source,ImageKnifeData);
               LogUtil.log("ImageKnife_DataTime_getAndShowImage_onLoadSuccess:"+currentRequest.imageKnifeOption.loadSrc)
             }
           } else if (requestWithSource.source == ImageKnifeRequestSource.ERROR_HOLDER) {
             requestWithSource.request.requestState = ImageKnifeRequestState.ERROR;
           }
+        } else {
+          if (requestWithSource.source == ImageKnifeRequestSource.SRC) {
+            if (requestWithSource.request.imageKnifeOption.onLoadListener &&
+            requestWithSource.request.imageKnifeOption.onLoadListener.onLoadCancel) {
+              // 回调请求成功
+              requestWithSource.request.imageKnifeOption.onLoadListener.onLoadCancel("component has destroyed");
+            }
+          }
         }
       });
 
@@ -447,6 +456,8 @@ async function requestJob(request: RequestJobRequest, requestList?: List<ImageKn
           await promise.then((data: number) => {
             if (data == 200) {
               resBuf = combineArrayBuffers(arrayBuffers)
+            } else {
+            loadError = "HttpDownloadClient has error, http code =" + JSON.stringify(data)
             }
           }).catch((err: Error) => {
             loadError = err.message;
@@ -501,16 +512,21 @@ async function requestJob(request: RequestJobRequest, requestList?: List<ImageKn
       }
     } else if ((request.src as Resource).id !== undefined) { //从资源文件获取
       let res = request.src as Resource;
+      let manager = request.context.createModuleContext(res.moduleName).resourceManager
       if (resBuf == undefined && request.onlyRetrieveFromCache != true && request.requestSource == ImageKnifeRequestSource.SRC) {
-        resBuf = request.context.createModuleContext(res.moduleName)
+        if(res.id == -1) {
-          .resourceManager
+          let resName = (res.params![0] as string)
-          .getMediaContentSync(res.id)
+          resBuf = (await manager.getMediaByName(resName.substring(10))).buffer as ArrayBuffer
-          .buffer as ArrayBuffer;
+        } else {
+          resBuf = manager.getMediaContentSync(res.id).buffer as ArrayBuffer
+        }
       } else if (resBuf == undefined && request.requestSource != ImageKnifeRequestSource.SRC) {
-        resBuf = request.context.createModuleContext(res.moduleName)
+        if(res.id == -1) {
-          .resourceManager
+          let resName = (res.params![0] as string)
-          .getMediaContentSync(res.id)
+          resBuf = (await manager.getMediaByName(resName.substring(10))).buffer as ArrayBuffer
-          .buffer as ArrayBuffer;
+        } else {
+          resBuf = manager.getMediaContentSync(res.id).buffer as ArrayBuffer
+        }
       }
     }
   }
@@ -528,6 +544,14 @@ async function requestJob(request: RequestJobRequest, requestList?: List<ImageKn
   LogUtil.log("ImageKnife_DataTime_requestJob_createPixelMap.start:"+request.src)
   let fileTypeUtil = new FileTypeUtil();
   let typeValue = fileTypeUtil.getFileType(resBuf);
+  if(typeValue == null) {
+    return {
+      pixelMap: undefined,
+      bufferSize: 0,
+      fileKey: '',
+      loadFail: "request is not a valid image source",
+    }
+  }
   let imageSource: image.ImageSource = image.createImageSource(resBuf);
   let decodingOptions: image.DecodingOptions = {
     editable: true,
@@ -545,7 +569,8 @@ async function requestJob(request: RequestJobRequest, requestList?: List<ImageKn
       pixelMap: base64str,
       bufferSize: bufferSize,
       fileKey: fileKey,
-      size:size
+      size:size,
+      type:typeValue
     };
   } else if(typeValue == "svg") {
     let hValue = Math.round(request.componentHeight);
@@ -567,6 +592,7 @@ async function requestJob(request: RequestJobRequest, requestList?: List<ImageKn
       pixelMap: resPixelmap,
       bufferSize: bufferSize,
       fileKey: fileKey,
+      type:typeValue
     };
   }
   let size = (await imageSource.getImageInfo()).size
@@ -586,7 +612,8 @@ async function requestJob(request: RequestJobRequest, requestList?: List<ImageKn
     pixelMap: resPixelmap,
     bufferSize: bufferSize,
     fileKey: fileKey,
-    size:size
+    size:size,
+    type:typeValue
   };
 }
 

library/src/main/ets/ImageKnifeOption.ets

@@ -14,13 +14,15 @@
  */
 import taskpool from '@ohos.taskpool';
 import common from '@ohos.app.ability.common'
-import { CacheStrategy } from './model/ImageKnifeData';
+import { CacheStrategy, ImageKnifeData,EventImage } from './model/ImageKnifeData';
 import { PixelMapTransformation } from './transform/PixelMapTransformation';
 
 export interface HeaderOptions {
   key: string;
   value: Object;
 }
+
+
 @Observed
 export class ImageKnifeOption {
   // 主图资源
@@ -29,37 +31,27 @@ export class ImageKnifeOption {
   placeholderSrc?: string | PixelMap | Resource;
   // 失败占位图
   errorholderSrc?: string | PixelMap | Resource;
-
   headerOption?: Array<HeaderOptions>;
-
   // 自定义缓存关键字
   signature?: string;
-
   // 主图填充效果
   objectFit?: ImageFit
-
   // 占位图填充效果
   placeholderObjectFit?: ImageFit
-
   // 错误图填充效果
   errorholderObjectFit?: ImageFit
-
   customGetImage?: (context: Context, src: string | PixelMap | Resource) => Promise<ArrayBuffer | undefined>
-
   border?: BorderOptions
   // 缓存策略
   writeCacheStrategy?: CacheStrategy
   // 仅使用缓存加载数据
   onlyRetrieveFromCache?: boolean = false;
-
   priority?: taskpool.Priority = taskpool.Priority.LOW
-
   context?: common.UIAbilityContext;
-
   progressListener?: (progress: number) => void;
-
   transformation?: PixelMapTransformation
   onLoadListener?: OnLoadCallBack | undefined;
+  onComplete?:(event:EventImage | undefined) => void
 
   constructor() {
 
@@ -72,8 +64,12 @@ export class ImageKnifeOption {
 export interface OnLoadCallBack {
   // 请求开始
   onLoadStart?: () => void;
+
   // 请求成功
-  onLoadSuccess?: (data: string | PixelMap | undefined,width?:number,height?:number) => void;
+  onLoadSuccess?: (data: string | PixelMap | undefined, imageKnifeData: ImageKnifeData) => void;
+
   // 请求结束
   onLoadFailed?: (err: string) => void;
+  // 请求取消
+  onLoadCancel?: (reason: string) => void;
 }

library/src/main/ets/components/ImageKnifeComponent.ets

@@ -83,6 +83,7 @@ export struct ImageKnifeComponent {
       .border(this.imageKnifeOption.border)
       .syncLoad(this.syncLoad)
       .draggable(false)
+      .onComplete(this.imageKnifeOption.onComplete)
       .onSizeChange((oldValue:SizeOptions, newValue:SizeOptions) => {
         this.currentWidth = newValue.width as number
         this.currentHeight = newValue.height as number

library/src/main/ets/model/ImageKnifeData.ets

@@ -22,9 +22,23 @@ import { Size } from '@kit.ArkUI'
 export interface ImageKnifeData {
   source: PixelMap | string,
   imageWidth: number,
-  imageHeight: number
+  imageHeight: number,
+  type?:string
+}
+/**
+ * onComplete成功回调
+ */
+export interface EventImage {
+  width: number;
+  height: number;
+  componentWidth: number;
+  componentHeight: number;
+  loadingStatus: number;
+  contentWidth: number;
+  contentHeight: number;
+  contentOffsetX: number;
+  contentOffsetY: number;
 }
-
 /**
  * 缓存策略
  */
@@ -60,7 +74,8 @@ export interface RequestJobResult {
   bufferSize: number
   fileKey: string
   loadFail?: string,
-  size?:Size
+  size?:Size,
+  type?: string
 }
 
 /**