diff --git a/CHANGELOG.md b/CHANGELOG.md index 794a2f7..324c392 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,6 @@ +## 3.1.1-rc.1 +- 新增图片加载的回调信息 +- 新增获取当前缓存的上限、大小及其当前对应缓存图片的个数的接口 ## 3.1.1-rc.0 - 重构代码：抽取ImageKnifeDispatcher子线程requestJob相关代码到ImageKnifeLoader中，降低函数复杂度 diff --git a/README.md b/README.md index bf787e0..4889f7d 100644 --- a/README.md +++ b/README.md @@ -264,6 +264,36 @@ ImageKnifeAnimatorComponent({ }),animatorOption:this.animatorOption }).width(300).height(300).backgroundColor(Color.Orange).margin({top:30}) ``` + +#### 11.Load the image callback information data +``` +ImageKnifeComponent({ ImageKnifeOption: = new ImageKnifeOption({ + loadSrc: $r('app.media.pngSample'), + objectFit: ImageFit.Contain, + onLoadListener: { + onLoadStart: (data) => { + let startCallBackData = JSON.stringify(data); + }, + onLoadFailed: (res, err) => { + let failedBackData = res + ";" + JSON.stringify(err); + }, + onLoadSuccess: (data, imageData) => { + let successBackData = JSON.stringify(imageData); + }, + onLoadCancel: (res, cel) => { + let cancelBackData = res + ";" + JSON.stringify(cel); + } + }, + border: { radius: 50 }, + onComplete: (event) => { + if (event && event.loadingStatus == 0) { + let render_success = JSON.stringify(Date.now()) + } + } + }) +}).width(100).height(100) +``` + #### Reuse Scenario Clear the component content in the **aboutToRecycle** lifecycle and trigger image loading through watch observeration. ## Available APIs @@ -307,7 +337,7 @@ Clear the component content in the **aboutToRecycle** lifecycle and trigger imag | transformation | PixelMapTransformation | Image transformation. Optional. | | drawingColorFilter | ColorFilter | Drawing color filter. Optional. | | onComplete | (event:EventImage \| undefined)=>void | Callback for image loading completion. Optional. | -| onLoadListener | onLoadStart:()=>void,onLoadSuccess:(data:string\|Pixelmap)=>void | Callback for image loading events. Optional. | +| onLoadListener | onLoadStart: (call?: ImageKnifeData) => void、onLoadSuccess: (data: string \| PixelMap \| undefined,call?: ImageKnifeData) => void、onLoadFailed: (err: string,errorInfo?: ErrorInfo) => void | Callback for image loading events. Optional. | ### ImageKnife @@ -325,6 +355,9 @@ Clear the component content in the **aboutToRecycle** lifecycle and trigger imag | putCacheImage | url: string, pixelMap: PixelMap, cacheType: CacheStrategy = CacheStrategy.Default, signature?: string | Writes to the memory disk cache. | | removeMemoryCache | url: string | Removes an entry from the memory cache. | | removeFileCache | url: string | Removes an entry from the file cache. | +| getCacheUpperLimit | cacheType?: CacheStrategy | Gets the upper limit size of the specified cache | +| getCurrentPicturesNum | cacheType?: CacheStrategy | Gets the number of images currently cached in the specified cache | +| getCurrentCacheSize | cacheType?: CacheStrategy | Gets the current size of the specified cache | ### Graphics tRansformation Types (GPUImage Dependency Required) | Type | Description | diff --git a/README_zh.md b/README_zh.md index 97522da..19a4d5c 100644 --- a/README_zh.md +++ b/README_zh.md @@ -264,6 +264,35 @@ ImageKnifeAnimatorComponent({ }),animatorOption:this.animatorOption }).width(300).height(300).backgroundColor(Color.Orange).margin({top:30}) ``` +#### 11.加载图片回调信息数据 示例 +``` +ImageKnifeComponent({ ImageKnifeOption: = new ImageKnifeOption({ + loadSrc: $r('app.media.pngSample'), + objectFit: ImageFit.Contain, + onLoadListener: { + onLoadStart: (data) => { + let startCallBackData = JSON.stringify(data); + }, + onLoadFailed: (res, err) => { + let failedBackData = res + ";" + JSON.stringify(err); + }, + onLoadSuccess: (data, imageData) => { + let successBackData = JSON.stringify(imageData); + }, + onLoadCancel: (res, cel) => { + let cancelBackData = res + ";" + JSON.stringify(cel); + } + }, + border: { radius: 50 }, + onComplete: (event) => { + if (event && event.loadingStatus == 0) { + let render_success = JSON.stringify(Date.now()) + } + } + }) +}).width(100).height(100) +``` + #### 复用场景 在aboutToRecycle生命周期清空组件内容；通过watch监听触发图片的加载。 ## 接口说明 @@ -287,44 +316,48 @@ ImageKnifeAnimatorComponent({ ### ImageKnifeOption参数列表 -| 参数名称 | 入参内容 | 功能简介 | -|-----------------------|-------------------------------------------------------|-----------------| -| loadSrc | string、PixelMap、Resource | 主图展示 | -| placeholderSrc | PixelMap、Resource | 占位图图展示（可选） | -| errorholderSrc | PixelMap、Resource | 错误图展示（可选） | -| objectFit | ImageFit | 主图填充效果（可选） | -| placeholderObjectFit | ImageFit | 占位图填充效果（可选） | -| errorholderObjectFit | ImageFit | 错误图填充效果（可选） | -| writeCacheStrategy | CacheStrategyType | 写入缓存策略(可选) | -| onlyRetrieveFromCache | boolean | 是否跳过网络和本地请求（可选） | -| customGetImage | (context: Context, src: string | 自定义下载图片（可选） | | Resource | 错误占位图数据源 | -| border | BorderOptions | 边框圆角（可选） | -| priority | taskpool.Priority | 加载优先级（可选） | -| context | common.UIAbilityContext | 上下文（可选） | -| progressListener | (progress: number)=>void | 进度（可选） | -| signature | String | 自定义缓存关键字（可选） | -| headerOption | Array | 设置请求头（可选） | -| transformation | PixelMapTransformation | 图片变换（可选） | -| drawingColorFilter | ColorFilter | drawing.ColorFilter | 图片变换（可选） | -| onComplete | (event:EventImage | undefined) => voi | 颜色滤镜效果（可选） | -| onLoadListener | onLoadStart: () => void、onLoadSuccess: (data: string | PixelMap | undefined) => void、onLoadFailed: (err: string) => void| 监听图片加载成功与失败 | +| 参数名称 | 入参内容 | 功能简介 | +|-----------------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------|-----------------| +| loadSrc | string、PixelMap、Resource | 主图展示 | +| placeholderSrc | PixelMap、Resource | 占位图图展示（可选） | +| errorholderSrc | PixelMap、Resource | 错误图展示（可选） | +| objectFit | ImageFit | 主图填充效果（可选） | +| placeholderObjectFit | ImageFit | 占位图填充效果（可选） | +| errorholderObjectFit | ImageFit | 错误图填充效果（可选） | +| writeCacheStrategy | CacheStrategyType | 写入缓存策略(可选) | +| onlyRetrieveFromCache | boolean | 是否跳过网络和本地请求（可选） | +| customGetImage | (context: Context, src: string | 自定义下载图片（可选） | | Resource | 错误占位图数据源 | +| border | BorderOptions | 边框圆角（可选） | +| priority | taskpool.Priority | 加载优先级（可选） | +| context | common.UIAbilityContext | 上下文（可选） | +| progressListener | (progress: number)=>void | 进度（可选） | +| signature | String | 自定义缓存关键字（可选） | +| headerOption | Array | 设置请求头（可选） | +| transformation | PixelMapTransformation | 图片变换（可选） | +| drawingColorFilter | ColorFilter \| drawing.ColorFilter | 图片变换（可选） | +| onComplete | (event:EventImage \| undefined) => voi | 颜色滤镜效果（可选） | +| onLoadListener | onLoadStart: (call?: ImageKnifeData) => void、onLoadSuccess: (data: string \| PixelMap \| undefined,call?: ImageKnifeData) => void、onLoadFailed: (err: string,errorInfo?: ErrorInfo) => void | 监听图片加载成功与失败 | ### ImageKnife接口 -| 参数名称 | 入参内容 | 功能简介 | -|------------------|-------------------------------------------------------------------------------------------------------|---------------| -| initMemoryCache | newMemoryCache: IMemoryCache | 自定义内存缓存策略 | -| initFileCache | context: Context, size: number, memory: number | 初始化文件缓存数量和大小 | -| preLoadCache | loadSrc: string I ImageKnifeOption | 预加载并返回文件缓存路径 | -| getCacheImage | loadSrc: string, cacheType: CacheStrategy = CacheStrategy.Default, signature?: string) | 从内存或文件缓存中获取资源 | -| addHeader | key: string, value: Object | 全局添加http请求头 | -| setHeaderOptions | Array | 全局设置http请求头 | -| deleteHeader | key: string | 全局删除http请求头 | -| setCustomGetImage | customGetImage?: (context: Context, src: string | PixelMap | Resource) => Promise | 全局设置自定义下载 | -| setEngineKeyImpl | IEngineKey | 全局配置缓存key生成策略 | -| putCacheImage | url: string, pixelMap: PixelMap, cacheType: CacheStrategy = CacheStrategy.Default, signature?: string | 写入内存磁盘缓存 | -| removeMemoryCache| url: string | ImageKnifeOption | 清理指定内存缓存 | -| removeFileCache | url: string | ImageKnifeOption | 清理指定磁盘缓存 | +| 参数名称 | 入参内容 | 功能简介 | +|------------------|-------------------------------------------------------------------------------------------------------|------------------| +| initMemoryCache | newMemoryCache: IMemoryCache | 自定义内存缓存策略 | +| initFileCache | context: Context, size: number, memory: number | 初始化文件缓存数量和大小 | +| preLoadCache | loadSrc: string I ImageKnifeOption | 预加载并返回文件缓存路径 | +| getCacheImage | loadSrc: string, cacheType: CacheStrategy = CacheStrategy.Default, signature?: string) | 从内存或文件缓存中获取资源 | +| addHeader | key: string, value: Object | 全局添加http请求头 | +| setHeaderOptions | Array | 全局设置http请求头 | +| deleteHeader | key: string | 全局删除http请求头 | +| setCustomGetImage | customGetImage?: (context: Context, src: string | PixelMap | Resource) => Promise | 全局设置自定义下载 | +| setEngineKeyImpl | IEngineKey | 全局配置缓存key生成策略 | +| putCacheImage | url: string, pixelMap: PixelMap, cacheType: CacheStrategy = CacheStrategy.Default, signature?: string | 写入内存磁盘缓存 | +| removeMemoryCache| url: string \| ImageKnifeOption | 清理指定内存缓存 | +| removeFileCache | url: string \| ImageKnifeOption | 清理指定磁盘缓存 | +| getCacheUpperLimit | cacheType?: CacheStrategy | 获取指定缓存的上限大小 | +| getCurrentPicturesNum | cacheType?: CacheStrategy | 获取指定缓存的当前缓存图片个数 | +| getCurrentCacheSize | cacheType?: CacheStrategy | 获取指定缓存的当前大小 | + ### 图形变换类型（需要为GPUImage添加依赖项） | 类型 | 相关描述 | diff --git a/library/src/main/ets/ImageKnife.ets b/library/src/main/ets/ImageKnife.ets index 79c9fe6..8381c8f 100644 --- a/library/src/main/ets/ImageKnife.ets +++ b/library/src/main/ets/ImageKnife.ets @@ -327,7 +327,7 @@ export class ImageKnife { * @param cacheType * @returns */ - getCurrentPicturesNum(cacheType: CacheStrategy): number | undefined { + getCurrentPicturesNum(cacheType?: CacheStrategy): number | undefined { if (cacheType == undefined || cacheType == CacheStrategy.Default) { cacheType = CacheStrategy.Memory; } @@ -347,7 +347,7 @@ export class ImageKnife { * @param cacheType * @returns */ - getCurrentCacheSize(cacheType: CacheStrategy): number | undefined { + getCurrentCacheSize(cacheType?: CacheStrategy): number | undefined { if (cacheType == undefined || cacheType == CacheStrategy.Default) { cacheType = CacheStrategy.Memory; }