Pre Merge pull request !151 from 面条侠/master
This commit is contained in:
面条侠
Gitee
commit
3a16a004b1
|
|
@ -333,6 +333,7 @@ request.skipMemoryCache(true)
|
|||
| preload(request: RequestOption) | request: RequestOption | 根据用户配置参数具体执行预加载流程 |
|
||||
| pauseRequests() | | 全局暂停请求 |
|
||||
| resumeRequests() | | 全局恢复暂停 |
|
||||
| isUrlExist(request: RequestOption) | request: RequestOption | 判断图片是否在 缓存和磁盘中存在，request.setCacheType(CacheType.Cache) request.setImageViewSize(this.comSize) 如果入参是缓存，需要传入值图片大小|
|
||||
|
||||
### 缓存策略相关
|
||||
|
||||
|
|
@ -368,6 +369,13 @@ request.skipMemoryCache(true)
|
|||
| ScaleType.AUTO_WIDTH | int | 设置高的时候，图片宽度自适应 |
|
||||
| ScaleType.AUTO | int | 没有设置宽和高，图片按照自身宽高显示 |
|
||||
|
||||
### CacheType类型展示效果
|
||||
|
||||
| 使用方法 | 类型 | 策略描述 |
|
||||
|-------------------------|-----|-----------------------------------|
|
||||
| CacheType.Cache| int | 缓存 |
|
||||
| CacheType.Disk | int | 磁盘 |
|
||||
|
||||
### 图片变换相关
|
||||
|
||||
| 使用方法 | 类型 | 相关描述 |
|
||||
|
|
|
|||
|
|
@ -0,0 +1,264 @@
|
|||
/*
|
||||
* Copyright (C) 2022 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,
|
||||
ImageKnifeGlobal,
|
||||
ImageKnife,
|
||||
ImageKnifeData,
|
||||
RequestOption,
|
||||
Size
|
||||
} from '@ohos/libraryimageknife'
|
||||
import image from '@ohos.multimedia.image';
|
||||
import { BusinessError } from '@ohos.base';
|
||||
import { CacheType } from '@ohos/imageknife/src/main/ets/components/imageknife/RequestOption';
|
||||
|
||||
|
||||
let imageKnife: ImageKnife | undefined = ImageKnifeGlobal.getInstance().getImageKnife();
|
||||
|
||||
@Entry
|
||||
@Component
|
||||
struct testImageKnifeCache {
|
||||
@State url: string = '网络图片地址';
|
||||
@State urlGif: string = 'gif地址';
|
||||
@State urlSvg: string = 'svg地址';
|
||||
@State urlPng: string = 'svg地址';
|
||||
@State urlJpg: string = 'svg地址';
|
||||
@State urlBmp: string = 'svg地址';
|
||||
@State urlWebp: string = 'svg地址';
|
||||
@State imagePixelMap: PixelMap | undefined = undefined;
|
||||
@State imagePixelMap_: PixelMap | undefined = undefined;
|
||||
private index_: number = -1;
|
||||
private tempSize: number = 200;
|
||||
private comSize: Size = {
|
||||
width: this.tempSize,
|
||||
height: this.tempSize,
|
||||
}
|
||||
@State imageKnifeOption: ImageKnifeOption =
|
||||
{
|
||||
loadSrc: $r('app.media.icon'),
|
||||
|
||||
placeholderSrc: $r('app.media.icon_loading'),
|
||||
errorholderSrc: $r('app.media.icon_failed')
|
||||
};
|
||||
|
||||
hasUrlCache(request: RequestOption) {
|
||||
|
||||
imageKnife?.isUrlExist(request).then((data: ImageKnifeData) => {
|
||||
|
||||
if (data.isPixelMap()) {
|
||||
if (data.drawPixelMap) {
|
||||
let pixelmap = data.drawPixelMap.imagePixelMap
|
||||
if (pixelmap) {
|
||||
|
||||
if (this.index_ == 1) {
|
||||
this.imagePixelMap = pixelmap;
|
||||
} else if (this.index_ == 2) {
|
||||
this.imagePixelMap_ = pixelmap;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
if (data.isGIFFrame()) {
|
||||
let index: number = 0
|
||||
let timeId = -1;
|
||||
clearTimeout(timeId);
|
||||
if (data.drawGIFFrame) {
|
||||
if (data.drawGIFFrame.imageGIFFrames) {
|
||||
let renderGif = () => {
|
||||
if (data.drawGIFFrame) {
|
||||
if (data.drawGIFFrame.imageGIFFrames) {
|
||||
let pixelmap = data.drawGIFFrame.imageGIFFrames[index].drawPixelMap
|
||||
let delay = data.drawGIFFrame.imageGIFFrames[index].delay
|
||||
if (pixelmap) {
|
||||
if (this.index_ == 1) {
|
||||
this.imagePixelMap = pixelmap;
|
||||
} else if (this.index_ == 2) {
|
||||
this.imagePixelMap_ = pixelmap;
|
||||
}
|
||||
}
|
||||
index++;
|
||||
if (index == data.drawGIFFrame.imageGIFFrames.length - 1) {
|
||||
index = 0
|
||||
}
|
||||
timeId = setTimeout(renderGif, data!.drawGIFFrame!.imageGIFFrames![index].delay)
|
||||
}
|
||||
}
|
||||
}
|
||||
renderGif()
|
||||
}
|
||||
}
|
||||
}
|
||||
}).catch((err: BusinessError) => {
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
build() {
|
||||
Scroll() {
|
||||
Column() {
|
||||
|
||||
Text('图片内存和磁盘读取').fontSize(30);
|
||||
Text('加载的缓存时候关闭掉网络').fontSize(15);
|
||||
|
||||
|
||||
Row() {
|
||||
Button('png')
|
||||
.onClick(() => {
|
||||
this.index_ = 0;
|
||||
this.url = this.urlPng;
|
||||
this.imageKnifeOption =
|
||||
{
|
||||
loadSrc: this.url,
|
||||
placeholderSrc: $r('app.media.icon_loading'),
|
||||
errorholderSrc: $r('app.media.icon_failed')
|
||||
}
|
||||
})
|
||||
|
||||
Button('bmp')
|
||||
.onClick(() => {
|
||||
this.index_ = 0;
|
||||
this.url = this.urlBmp;
|
||||
this.imageKnifeOption =
|
||||
{
|
||||
loadSrc: this.url,
|
||||
placeholderSrc: $r('app.media.icon_loading'),
|
||||
errorholderSrc: $r('app.media.icon_failed')
|
||||
}
|
||||
})
|
||||
|
||||
Button('webp')
|
||||
.onClick(() => {
|
||||
this.index_ = 0;
|
||||
this.url = this.urlWebp;
|
||||
this.imageKnifeOption =
|
||||
{
|
||||
loadSrc: this.url,
|
||||
placeholderSrc: $r('app.media.icon_loading'),
|
||||
errorholderSrc: $r('app.media.icon_failed')
|
||||
}
|
||||
})
|
||||
|
||||
Button('jpg')
|
||||
.onClick(() => {
|
||||
this.index_ = 0;
|
||||
this.url = this.urlJpg;
|
||||
this.imageKnifeOption =
|
||||
{
|
||||
loadSrc: this.url,
|
||||
placeholderSrc: $r('app.media.icon_loading'),
|
||||
errorholderSrc: $r('app.media.icon_failed')
|
||||
}
|
||||
})
|
||||
|
||||
Button('gif')
|
||||
.onClick(() => {
|
||||
this.index_ = 0;
|
||||
this.url = this.urlGif;
|
||||
this.imageKnifeOption =
|
||||
{
|
||||
loadSrc: this.url,
|
||||
placeholderSrc: $r('app.media.icon_loading'),
|
||||
errorholderSrc: $r('app.media.icon_failed')
|
||||
}
|
||||
})
|
||||
|
||||
Button('svg')
|
||||
.onClick(() => {
|
||||
this.index_ = 0;
|
||||
this.url = this.urlSvg;
|
||||
this.imageKnifeOption =
|
||||
{
|
||||
loadSrc: this.url,
|
||||
placeholderSrc: $r('app.media.icon_loading'),
|
||||
errorholderSrc: $r('app.media.icon_failed')
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
|
||||
Row() {
|
||||
Button('缓存图片')
|
||||
.onClick(() => {
|
||||
this.index_ = 1;
|
||||
let request = new RequestOption();
|
||||
request.load(this.url)
|
||||
.setImageViewSize(this.comSize)
|
||||
.setCacheType(CacheType.Cache);
|
||||
this.hasUrlCache(request);
|
||||
|
||||
})
|
||||
|
||||
Button('磁盘图片')
|
||||
.onClick(() => {
|
||||
this.index_ = 2;
|
||||
let request = new RequestOption();
|
||||
request.load(this.url)
|
||||
.setImageViewSize(this.comSize)
|
||||
.setCacheType(CacheType.Cache);
|
||||
this.hasUrlCache(request);
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
Text('网络图').fontSize(15);
|
||||
ImageKnifeComponent({ imageKnifeOption: this.imageKnifeOption })
|
||||
.width(200)
|
||||
.height(200)
|
||||
.backgroundColor(Color.Orange)
|
||||
Text('缓存图').fontSize(15);
|
||||
|
||||
ImageKnifeComponent({
|
||||
imageKnifeOption: {
|
||||
loadSrc: this.imagePixelMap as image.PixelMap
|
||||
}
|
||||
})
|
||||
.width(200)
|
||||
.height(200)
|
||||
.backgroundColor(Color.Orange)
|
||||
Text('磁盘图').fontSize(15);
|
||||
ImageKnifeComponent({
|
||||
imageKnifeOption: {
|
||||
loadSrc: this.imagePixelMap_ as image.PixelMap
|
||||
}
|
||||
})
|
||||
.width(200)
|
||||
.height(200)
|
||||
.backgroundColor(Color.Orange)
|
||||
|
||||
}
|
||||
.alignItems(HorizontalAlign.Center)
|
||||
.width('100%')
|
||||
|
||||
}
|
||||
.width('100%')
|
||||
.height('100%')
|
||||
}
|
||||
|
||||
aboutToAppear() {
|
||||
|
||||
}
|
||||
|
||||
aboutToDisappear() {
|
||||
|
||||
}
|
||||
|
||||
onBackPress() {
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -45,6 +45,7 @@
|
|||
"pages/testImageKnifeAutoWidthPage",
|
||||
"pages/testImageKnifeAutoHeightPage",
|
||||
"pages/testPriorityComponent",
|
||||
"pages/testReusePhotoPage"
|
||||
"pages/testReusePhotoPage",
|
||||
"pages/testImageKnifeCache"
|
||||
]
|
||||
}
|
||||
|
|
@ -16,7 +16,7 @@
|
|||
import { DiskLruCache } from "../cache/DiskLruCache"
|
||||
import { EngineKeyFactories } from "../cache/key/EngineKeyFactories"
|
||||
import { EngineKeyInterface } from "../cache/key/EngineKeyInterface"
|
||||
import { RequestOption, Size } from "../imageknife/RequestOption"
|
||||
import { CacheType, RequestOption, Size } from "../imageknife/RequestOption"
|
||||
import { AsyncCallback } from "../imageknife/interface/AsyncCallback"
|
||||
import { PlaceHolderManager } from "../imageknife/holder/PlaceHolderManager"
|
||||
import { RetryHolderManager } from "../imageknife/holder/RetryHolderManager"
|
||||
|
|
@ -48,6 +48,10 @@ import { MemoryCacheProxy } from './requestmanage/MemoryCacheProxy'
|
|||
import { ObjectKey } from './ObjectKey'
|
||||
import { TaskParams } from './TaskParams'
|
||||
import { Constants } from './constants/Constants'
|
||||
import { SVGParseImpl } from './utils/svg/SVGParseImpl'
|
||||
import { ParseImageUtil } from './utils/ParseImageUtil'
|
||||
import { IParseImage } from './interface/IParseImage'
|
||||
import { GIFParseImpl } from './utils/gif/GIFParseImpl'
|
||||
|
||||
export class ImageKnife {
|
||||
static readonly SEPARATOR: string = '/'
|
||||
|
|
@ -77,9 +81,10 @@ export class ImageKnife {
|
|||
defaultLifeCycle: IDrawLifeCycle | undefined = undefined;
|
||||
// 开发者可配置全局缓存
|
||||
engineKeyImpl: EngineKeyInterface;
|
||||
private mParseImageUtil: IParseImage<PixelMap>;
|
||||
|
||||
private constructor() {
|
||||
|
||||
this.mParseImageUtil = new ParseImageUtil();
|
||||
this.runningMaps = new EasyLinkedHashMap();
|
||||
this.pendingMaps = new EasyLinkedHashMap();
|
||||
this.pausedMaps = new EasyLinkedHashMap();
|
||||
|
|
@ -321,6 +326,91 @@ export class ImageKnife {
|
|||
return this.parseSource(request);
|
||||
}
|
||||
|
||||
|
||||
|
||||
public isUrlExist(request: RequestOption): Promise<ImageKnifeData> {
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
this.generateDataCacheKey(request);
|
||||
let loadComplete = (imageKnifeData: ImageKnifeData) => {
|
||||
resolve(imageKnifeData);
|
||||
}
|
||||
let loadError = (err ?: BusinessError | string) => {
|
||||
reject(undefined);
|
||||
}
|
||||
this.loadMemoryCacheAndDiskFrom(request, loadComplete, loadError);
|
||||
})
|
||||
}
|
||||
|
||||
loadMemoryCacheAndDiskFrom(request: RequestOption, onComplete: (imageKnifeData: ImageKnifeData) => void | PromiseLike<ImageKnifeData>, onError: (err?: BusinessError | string) => void) {
|
||||
|
||||
if (request.cacheType == CacheType.Cache) {
|
||||
|
||||
let cache = this.memoryCacheProxy.loadMemoryCache(request.generateCacheKey, true);
|
||||
if (cache == null || typeof cache == 'undefined') {
|
||||
onError("No data in cache!")
|
||||
}else {
|
||||
cache.waitSaveDisk = false;
|
||||
//2.网络缓存有数据，返回
|
||||
onComplete(cache);
|
||||
}
|
||||
|
||||
}else if (request.cacheType == CacheType.Disk){
|
||||
let cached: ArrayBuffer = DiskLruCache.getFileCacheByFile((ImageKnifeGlobal.getInstance()
|
||||
.getHapContext() as common.UIAbilityContext).filesDir as string, request.generateDataKey) as ArrayBuffer;
|
||||
|
||||
if (cached != null) {
|
||||
|
||||
let filetype: string | null = this.fileTypeUtil.getFileType(cached);
|
||||
|
||||
if (filetype == null) {
|
||||
onError('请检查数据源');
|
||||
return;
|
||||
}
|
||||
|
||||
if (!this.fileTypeUtil.isImage(cached)) {
|
||||
onError('暂不支持的类型！类型=' + filetype);
|
||||
}
|
||||
|
||||
if (ImageKnifeData.GIF == filetype && !request.dontAnimateFlag) {
|
||||
let gifParseImpl = new GIFParseImpl()
|
||||
gifParseImpl.parseGifs(cached, (data?: GIFFrame[], err?: BusinessError | string) => {
|
||||
if (err) {
|
||||
onError(err)
|
||||
}
|
||||
LogUtil.log("gifProcess data is null:" + (data == null));
|
||||
if (!!data) {
|
||||
let imageKnifeData = ImageKnifeData.createImageGIFFrame(ImageKnifeType.GIFFRAME, data);
|
||||
LogUtil.log('gifProcess 生成gif 返回数据类型')
|
||||
onComplete(imageKnifeData)
|
||||
} else {
|
||||
onError('Parse GIF callback data is null, you need check callback data!')
|
||||
}
|
||||
})
|
||||
|
||||
} else if (ImageKnifeData.SVG == filetype) {
|
||||
let svgParseImpl = new SVGParseImpl()
|
||||
let success = (value: PixelMap) => {
|
||||
let imageKnifeData = ImageKnifeData.createImagePixelMap(ImageKnifeType.PIXELMAP, value);
|
||||
onComplete(imageKnifeData);
|
||||
}
|
||||
svgParseImpl.parseSvg(request, cached, success, onError)
|
||||
} else {
|
||||
//5.磁盘有数据，解析错误返回onError
|
||||
let success = (value: PixelMap) => {
|
||||
let imageKnifeData = ImageKnifeData.createImagePixelMap(ImageKnifeType.PIXELMAP, value);
|
||||
onComplete(imageKnifeData);
|
||||
}
|
||||
this.mParseImageUtil.parseImage(cached, success, onError)
|
||||
}
|
||||
|
||||
} else {
|
||||
//6.磁盘无数据，返回onError
|
||||
onError("No data in disk cache!")
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
generateDataCacheKey(request: RequestOption) {
|
||||
let factories: EngineKeyInterface;
|
||||
let cacheKey: string;
|
||||
|
|
|
|||
|
|
@ -65,6 +65,13 @@ export interface Size {
|
|||
height: number
|
||||
}
|
||||
|
||||
export enum CacheType {
|
||||
//缓存
|
||||
Cache,
|
||||
//磁盘
|
||||
Disk
|
||||
}
|
||||
|
||||
export interface DetachFromLayout {
|
||||
detach: () => void
|
||||
}
|
||||
|
|
@ -86,6 +93,7 @@ export class RequestOption {
|
|||
addHeaderMap(map: Map<string, Object>) {
|
||||
this.headers = map;
|
||||
}
|
||||
cacheType: CacheType = CacheType.Disk;
|
||||
// 优先级
|
||||
priority: Priority = Priority.MEDIUM;
|
||||
uuid: string = '' // 唯一标识
|
||||
|
|
@ -186,6 +194,10 @@ export class RequestOption {
|
|||
return this.moduleContext;
|
||||
}
|
||||
|
||||
setCacheType(cacheType: CacheType) {
|
||||
this.cacheType = cacheType;
|
||||
return this;
|
||||
}
|
||||
/**
|
||||
* set image Component size
|
||||
*/
|
||||
|
|
|
|||
Loading…
Reference in New Issue