!21 ImageKnife新增本地沙盒图片文件加载能力

Merge pull request !21 from zhoulisheng1/master

README.md

@@ -60,7 +60,7 @@ struct Index {
   build() {
     Scroll() {
       Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
-        ImageKnifeComponent({ imageKnifeOption: $imageKnifeOption1 })
+        ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption1 })
           .width(300) // 自定义组件支持通用属性链式调用，可以直接设置宽高
           .height(300)
       }
@@ -107,7 +107,7 @@ struct IndexFunctionDemo {
     Scroll() {
       Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
         Text("简单示例：加载一张gif图片").fontSize(15)
-        ImageKnifeComponent({ imageKnifeOption: $imageKnifeOption })
+        ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption })
           .width(300) // 自定义组件支持通用属性链式调用，可以直接设置宽高
           .height(300)
       }
@@ -254,7 +254,7 @@ struct Index {
   build() {
     Scroll() {
       Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
-        ImageKnifeComponent({ imageKnifeOption: $imageKnifeOption1 })
+        ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption1 })
       }
     }
     .width('100%')

entry/src/main/ets/pages/index.ets

@@ -61,7 +61,7 @@ struct IndexFunctionDemo {
           Button("加载GIF")
             .onClick(() => {
               this.imageKnifeOption2 = {
-                loadSrc: 'https://pic.ibaotu.com/gif/18/17/16/51u888piCtqj.gif!fwpaa70/fw/700',
+                loadSrc: 'https://gd-hbimg.huaban.com/e0a25a7cab0d7c2431978726971d61720732728a315ae-57EskW_fw658',
 
                 placeholderSrc: $r('app.media.icon_loading'),
                 errorholderSrc: $r('app.media.icon_failed'),

entry/src/main/ets/pages/testGifDontAnimatePage.ets

@@ -58,7 +58,7 @@ struct TestGifDontAnimatePage {
           Button('网络资源gif')
             .onClick(()=>{
             this.imageKnifeOption1 = {
-              loadSrc: 'https://pic.ibaotu.com/gif/18/17/16/51u888piCtqj.gif!fwpaa70/fw/700',
+              loadSrc: 'https://gd-hbimg.huaban.com/e0a25a7cab0d7c2431978726971d61720732728a315ae-57EskW_fw658',
               placeholderSrc: $r('app.media.icon_loading'),
               errorholderSrc: $r('app.media.icon_failed'),
             };
@@ -66,7 +66,7 @@ struct TestGifDontAnimatePage {
           Button('网络资源gif静态')
             .onClick(()=>{
             this.imageKnifeOption1 = {
-              loadSrc: 'https://pic.ibaotu.com/gif/18/17/16/51u888piCtqj.gif!fwpaa70/fw/700',
+              loadSrc: 'https://gd-hbimg.huaban.com/e0a25a7cab0d7c2431978726971d61720732728a315ae-57EskW_fw658',
               placeholderSrc: $r('app.media.icon_loading'),
               errorholderSrc: $r('app.media.icon_failed'),
               dontAnimateFlag:true

entry/src/main/ets/pages/testImageKnifeOptionChangedPage.ets

@@ -150,7 +150,7 @@ struct TestImageKnifeOptionChangedPage {
            Button('gif')
           .onClick(()=>{
              this.imageKnifeOption1 = {
-               loadSrc: 'https://pic.ibaotu.com/gif/18/17/16/51u888piCtqj.gif!fwpaa70/fw/700',
+               loadSrc: 'https://gd-hbimg.huaban.com/e0a25a7cab0d7c2431978726971d61720732728a315ae-57EskW_fw658',
 
                placeholderSrc: $r('app.media.icon_loading'),
                errorholderSrc: $r('app.media.icon_failed')

entry/src/main/ets/pages/testPreloadPage.ets

@@ -148,7 +148,7 @@ struct TestPreloadPage {
             Button('预加载网络资源gif')
               .onClick(() => {
               let request = new RequestOption();
-              request.load('https://pic.ibaotu.com/gif/18/17/16/51u888piCtqj.gif!fwpaa70/fw/700')
+              request.load('https://gd-hbimg.huaban.com/e0a25a7cab0d7c2431978726971d61720732728a315ae-57EskW_fw658')
                 .setImageViewSize({ width: 300, height: 300 })
                 .addListener((err, data) => {
                 if (err && err.length > 0) {
@@ -166,7 +166,7 @@ struct TestPreloadPage {
             Button('网络资源gif')
               .onClick(() => {
               this.imageKnifeOption1 = {
-                loadSrc: 'https://pic.ibaotu.com/gif/18/17/16/51u888piCtqj.gif!fwpaa70/fw/700',
+                loadSrc: 'https://gd-hbimg.huaban.com/e0a25a7cab0d7c2431978726971d61720732728a315ae-57EskW_fw658',
 
                 placeholderSrc: $r('app.media.icon_loading'),
                 errorholderSrc: $r('app.media.icon_failed'),
@@ -179,7 +179,7 @@ struct TestPreloadPage {
             Button('预加载网络资源gif静态')
               .onClick(() => {
               let request = new RequestOption();
-              request.load('https://pic.ibaotu.com/gif/18/17/16/51u888piCtqj.gif!fwpaa70/fw/700')
+              request.load('https://gd-hbimg.huaban.com/e0a25a7cab0d7c2431978726971d61720732728a315ae-57EskW_fw658')
                 .setImageViewSize({ width: 300, height: 300 })
                 .dontAnimate()
                 .addListener((err, data) => {
@@ -198,7 +198,7 @@ struct TestPreloadPage {
             Button('网络资源gif静态')
               .onClick(() => {
               this.imageKnifeOption1 = {
-                loadSrc: 'https://pic.ibaotu.com/gif/18/17/16/51u888piCtqj.gif!fwpaa70/fw/700',
+                loadSrc: 'https://gd-hbimg.huaban.com/e0a25a7cab0d7c2431978726971d61720732728a315ae-57EskW_fw658',
 
                 placeholderSrc: $r('app.media.icon_loading'),
                 errorholderSrc: $r('app.media.icon_failed'),

imageknife/src/main/ets/components/imageknife/networkmanage/DownloadClient.ets

@@ -13,110 +13,29 @@
  * limitations under the License.
  */
 
-import { IDataFetch } from "../networkmanage/IDataFetch"
+import { IDataFetch } from '../networkmanage/IDataFetch'
-import { RequestOption } from "../RequestOption"
+import { RequestOption } from '../RequestOption'
-import { Md5 } from "../../cache/Md5"
+import { Md5 } from '../../cache/Md5'
-import { FileUtils } from "../../cache/FileUtils"
+import { FileUtils } from '../../cache/FileUtils'
+import { NetworkDownloadClient } from './NetworkDownloadClient'
+import { LoadLocalFileClient } from './LoadLocalFileClient'
 import loadRequest from '@ohos.request';
 
+// 数据加载器
 export class DownloadClient implements IDataFetch {
+  private networkClient = new NetworkDownloadClient();
+  private localFileClient = new LoadLocalFileClient();
+
   loadData(request: RequestOption, onCompleteFunction, onErrorFunction) {
-
+    if (typeof request.loadSrc == 'string') {
-    let filename = Md5.hashStr(request.generateDataKey);
+      if (request.loadSrc.startsWith(globalThis.ImageKnife.getImageKnifeContext()
-    let downloadFolder = request.getFilesPath() + "/" + request.networkCacheFolder;
+        .filesDir) || request.loadSrc.startsWith(globalThis.ImageKnife.getImageKnifeContext().cacheDir)) {
-    let allpath = request.getFilesPath() + "/" + request.networkCacheFolder + "/" + filename + ".img";
+        // 本地沙盒
-
+        this.localFileClient.loadData(request, onCompleteFunction, onErrorFunction)
-    if (!FileUtils.getInstance().existFolder(downloadFolder)) {
-      FileUtils.getInstance().createFolder(downloadFolder)
-    }
-
-    if (FileUtils.getInstance().exist(allpath)) {
-      FileUtils.getInstance().deleteFile(allpath)
-    }
-
-    let desc = filename + ".img";
-    var downloadConfig = {
-      url: (request.loadSrc as string),
-      filePath: allpath,
-    };
-
-    let loadTask = null;
-    loadRequest.download(globalThis.ImageKnife.getImageKnifeContext(), downloadConfig).then(downloadTask => {
-      if (downloadTask) {
-        loadTask = downloadTask;
-
-        loadTask.on('progress', (receivedSize, totalSize) => {
-          if(totalSize > 0) {
-            // 并不是所有服务器都会返回totalSize 当没有文件大小的时候,下载进度没有百分比回调,只能知道目前下载了多少数据量
-            let percent = Math.round(((receivedSize * 1.0) / (totalSize * 1.0)) * 100)
-            if (request.progressFunc) {
-              request.progressFunc(percent);
-            }
-          }
-        });
-
-        loadTask.on('complete', () => {
-          let downloadPath = allpath;
-          request.downloadFilePath = downloadPath;
-          let arraybuffer = FileUtils.getInstance().readFilePic(downloadPath)
-          onCompleteFunction(arraybuffer);
-          FileUtils.getInstance().deleteFile(downloadPath);
-
-          loadTask.off('complete', () => {
-
-          })
-
-          loadTask.off('pause', () => {
-          })
-
-          loadTask.off('remove', () => {
-          })
-
-          loadTask.off('progress', () => {
-          })
-
-          loadTask.off('fail', () => {
-          })
-          loadTask = null;
-        })
-
-        loadTask.on('pause', () => {
-        })
-
-        loadTask.on('remove', () => {
-        })
-
-        loadTask.on('fail', (err) => {
-          onErrorFunction('DownloadClient Download task fail err =' + err)
-          if (loadTask) {
-            loadTask.remove().then(result => {
-              loadTask.off('complete', () => {
-              })
-
-              loadTask.off('pause', () => {
-              })
-
-              loadTask.off('remove', () => {
-              })
-
-              loadTask.off('progress', () => {
-              })
-
-              loadTask.off('fail', () => {
-              })
-              loadTask = null
-            }).catch(err => {
-              loadTask = null;
-              console.log('DownloadClient Download task fail err =' + err);
-            })
-          }
-        })
-
       } else {
-        onErrorFunction('DownloadClient downloadTask dismiss!')
+        // 网络下载
+        this.networkClient.loadData(request, onCompleteFunction, onErrorFunction)
+      }
     }
-    }).catch((err) => {
-      onErrorFunction(err)
-    })
   }
 }

imageknife/src/main/ets/components/imageknife/networkmanage/IDataFetch.ets

@@ -13,9 +13,9 @@
  * limitations under the License.
  */
 
-import {RequestOption} from "../RequestOption"
+import { RequestOption } from '../RequestOption'
 
-// 网络接口
+// 资源加载接口
 export interface IDataFetch {
-  loadData(request: RequestOption, onCompleteFunction, onErrorFunction);
+  loadData(request: RequestOption, onComplete: (img: ArrayBuffer) => void, onError: (err: string) => void);
 }

imageknife/src/main/ets/components/imageknife/networkmanage/LoadLocalFileClient.ets

@@ -0,0 +1,33 @@
+/*
+ * 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 { IDataFetch } from '../networkmanage/IDataFetch'
+import { RequestOption } from '../RequestOption'
+import { Md5 } from '../../cache/Md5'
+import { FileUtils } from '../../cache/FileUtils'
+import loadRequest from '@ohos.request';
+
+export class LoadLocalFileClient {
+  loadData(request: RequestOption,  onComplete: (img: ArrayBuffer) => void, onError: (err: string) => void) {
+    if (typeof request.loadSrc == 'string') {
+      let fileBuffer = FileUtils.getInstance().readFilePic(request.loadSrc)
+      if (fileBuffer == null || fileBuffer.byteLength <= 0) {
+        onError('LoadLocalFileClient loadLocalFileData The File Does Not Exist!Check The File!')
+      } else {
+        onComplete(fileBuffer);
+      }
+    }
+  }
+}

imageknife/src/main/ets/components/imageknife/networkmanage/NetworkDownloadClient.ets

@@ -0,0 +1,118 @@
+/*
+ * 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 { IDataFetch } from '../networkmanage/IDataFetch'
+import { RequestOption } from '../RequestOption'
+import { Md5 } from '../../cache/Md5'
+import { FileUtils } from '../../cache/FileUtils'
+import loadRequest from '@ohos.request';
+
+// 数据加载器
+export class NetworkDownloadClient {
+  loadData(request: RequestOption, onComplete: (img: ArrayBuffer) => void, onError: (err: string) => void) {
+    let filename = Md5.hashStr(request.generateDataKey);
+    let downloadFolder = request.getFilesPath() + "/" + request.networkCacheFolder;
+    let allpath = request.getFilesPath() + "/" + request.networkCacheFolder + "/" + filename + ".img";
+    if (!FileUtils.getInstance().existFolder(downloadFolder)) {
+      FileUtils.getInstance().createFolder(downloadFolder)
+    }
+    if (FileUtils.getInstance().exist(allpath)) {
+      FileUtils.getInstance().deleteFile(allpath)
+    }
+    var downloadConfig = {
+      url: (request.loadSrc as string),
+      filePath: allpath,
+    };
+    let loadTask = null;
+    loadRequest.download(globalThis.ImageKnife.getImageKnifeContext(), downloadConfig).then(downloadTask => {
+      if (downloadTask) {
+        loadTask = downloadTask;
+
+        loadTask.on('progress', (receivedSize, totalSize) => {
+          if (totalSize > 0) {
+            // 并不是所有服务器都会返回totalSize 当没有文件大小的时候,下载进度没有百分比回调,只能知道目前下载了多少数据量
+            let percent = Math.round(((receivedSize * 1.0) / (totalSize * 1.0)) * 100)
+            if (request.progressFunc) {
+              request.progressFunc(percent);
+            }
+          }
+        });
+
+        loadTask.on('complete', () => {
+          let downloadPath = allpath;
+          request.downloadFilePath = downloadPath;
+          let arraybuffer = FileUtils.getInstance().readFilePic(downloadPath)
+          onComplete(arraybuffer);
+          FileUtils.getInstance().deleteFile(downloadPath);
+
+          loadTask.off('complete', () => {
+
+          })
+
+          loadTask.off('pause', () => {
+          })
+
+          loadTask.off('remove', () => {
+          })
+
+          loadTask.off('progress', () => {
+          })
+
+          loadTask.off('fail', () => {
+          })
+          loadTask = null;
+        })
+
+        loadTask.on('pause', () => {
+        })
+
+        loadTask.on('remove', () => {
+        })
+
+        loadTask.on('fail', (err) => {
+          onError('NetworkDownloadClient Download task fail err =' + err)
+          if (loadTask) {
+            loadTask.remove().then(result => {
+              loadTask.off('complete', () => {
+              })
+
+              loadTask.off('pause', () => {
+              })
+
+              loadTask.off('remove', () => {
+              })
+
+              loadTask.off('progress', () => {
+              })
+
+              loadTask.off('fail', () => {
+              })
+              loadTask = null
+            }).catch(err => {
+              loadTask = null;
+              console.log('NetworkDownloadClient Download task fail err =' + err);
+            })
+          }
+        })
+
+      } else {
+        onError('NetworkDownloadClient downloadTask dismiss!')
+      }
+    })
+      .catch((err) => {
+      onError("下载子系统download错误捕获,error="+err.message);
+    })
+  }
+}

imageknife/src/main/ets/components/imageknife/requestmanage/RequestManager.ets

@@ -190,7 +190,10 @@ export class RequestManager {
       let success = (arraybuffer) => {
         this.downloadSuccess(arraybuffer, onComplete, onError)
       }
-      this.mIDataFetch.loadData(request, success, onError);
+      let error = (errorMsg:string) =>{
+        onError(errorMsg)
+      }
+      this.mIDataFetch.loadData(request, success, error);
   }
 
   // 加载本地资源