floraachy
/
ImageKnife
mirror of https://gitee.com/openharmony-tpc/ImageKnife.git
1
0
Fork 1
Code Issues Packages Projects Releases Wiki Activity

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

Merge pull request !21 from zhoulisheng1/master
This commit is contained in:
openharmony_ci 2023-01-16 02:30:28 +00:00 committed by Gitee
parent fb904dbd2d 5c3e35da4e
commit 01c960daba
No known key found for this signature in database
GPG Key ID: 173E9B9CA92EEF8F
10 changed files with 187 additions and 114 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
README.md
View File

@ -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%')

2
entry/src/main/ets/pages/index.ets
View File

@ -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'),

4
entry/src/main/ets/pages/testGifDontAnimatePage.ets
View File

@ -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

2
entry/src/main/ets/pages/testImageKnifeOptionChangedPage.ets
View File

@ -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')

8
entry/src/main/ets/pages/testPreloadPage.ets
View File

@ -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'),

119
imageknife/src/main/ets/components/imageknife/networkmanage/DownloadClient.ets
View File

@ -13,110 +13,29 @@
* limitations under the License.
*/
import { IDataFetch } from "../networkmanage/IDataFetch"
import { RequestOption } from "../RequestOption"
import { Md5 } from "../../cache/Md5"
import { FileUtils } from "../../cache/FileUtils"
import { IDataFetch } from '../networkmanage/IDataFetch'
import { RequestOption } from '../RequestOption'
import { Md5 } from '../../cache/Md5'
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) {
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)
}
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);
})
}
})
if (typeof request.loadSrc == 'string') {
if (request.loadSrc.startsWith(globalThis.ImageKnife.getImageKnifeContext()
.filesDir) || request.loadSrc.startsWith(globalThis.ImageKnife.getImageKnifeContext().cacheDir)) {
// 本地沙盒
this.localFileClient.loadData(request, onCompleteFunction, onErrorFunction)
} else {
onErrorFunction('DownloadClient downloadTask dismiss!')
}
}).catch((err) => {
onErrorFunction(err)
})
// 网络下载
this.networkClient.loadData(request, onCompleteFunction, onErrorFunction)
}
}
}
}

6
imageknife/src/main/ets/components/imageknife/networkmanage/IDataFetch.ets
View File

@ -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);
}

33
imageknife/src/main/ets/components/imageknife/networkmanage/LoadLocalFileClient.ets Normal file
View File

@ -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);
}
}
}
}

118
imageknife/src/main/ets/components/imageknife/networkmanage/NetworkDownloadClient.ets Normal file
View File

@ -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);
})
}
}

5
imageknife/src/main/ets/components/imageknife/requestmanage/RequestManager.ets
View File

@ -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);
}
// 加载本地资源