鸿蒙Harmony开发:图像加载缓-ImageKnife

 简介

本项目参考开源库 Glide 进行OpenHarmony的自研版本:

  • 支持自定义内存缓存策略,支持设置内存缓存的大小(默认LRU策略)。
  • 支持磁盘二级缓存,对于下载图片会保存一份至磁盘当中。
  • 支持自定义实现图片获取/网络下载
  • 支持监听网络下载回调进度
  • 继承Image的能力,支持option传入border,设置边框,圆角
  • 继承Image的能力,支持option传入objectFit设置图片缩放,包括objectFit为auto时根据图片自适应高度
  • 支持通过设置transform缩放图片
  • 并发请求数量,支持请求排队队列的优先级
  • 支持生命周期已销毁的图片,不再发起请求
  • 自定义缓存key
  • 自定义http网络请求头
  • 支持writeCacheStrategy控制缓存的存入策略(只存入内存或文件缓存)
  • 支持preLoadCache预加载图片
  • 支持onlyRetrieveFromCache仅用缓存加载
  • 支持使用一个或多个图片变换,如模糊,高亮等

待实现特性

  • gif/webp动图显示与控制
  • 内存降采样优化,节约内存的占用
  • 支持自定义图片解码

注意:3.x版本相对2.x版本做了重大的重构,主要体现在:

  • 使用Image组件代替Canvas组件渲染
  • 重构Dispatch分发逻辑,支持控制并发请求数,支持请求排队队列的优先级
  • 支持通过initMemoryCache自定义策略内存缓存策略和大小
  • 支持option自定义实现图片获取/网络下载

因此API及能力上,目前有部分差异,主要体现在:

  • 不支持drawLifeCycle接口,通过canvas自会图片
  • mainScaleType,border等参数,新版本与系统Image保持一致
  • gif/webp动图播放与控制
  • 抗锯齿相关参数

下载安装

ohpm install @ohos/imageknife

// 如果需要用文件缓存,需要提前初始化文件缓存
await ImageKnife.getInstance().initFileCache(context, 256, 256 * 1024 * 1024)

使用说明

1.显示本地资源图片
ImageKnifeComponent({
  ImageKnifeOption: new ImageKnifeOption({
    loadSrc: $r("app.media.app_icon"),
    placeholderSrc: $r("app.media.loading"),
    errorholderSrc: $r("app.media.app_icon"),
    objectFit: ImageFit.Auto
  })
}).width(100).height(100)
2.显示本地context files下文件
ImageKnifeComponent({
  ImageKnifeOption: new ImageKnifeOption({
    loadSrc: this.localFile,
    placeholderSrc: $r("app.media.loading"),
    errorholderSrc: $r("app.media.app_icon"),
    objectFit: ImageFit.Auto
  })
}).width(100).height(100)
3.显示网络图片
ImageKnifeComponent({
  ImageKnifeOption: new ImageKnifeOption({
    loadSrc:"https://www.openharmony.cn/_nuxt/img/logo.dcf95b3.png",
    placeholderSrc: $r("app.media.loading"),
    errorholderSrc: $r("app.media.app_icon"),
    objectFit: ImageFit.Auto
  })
}).width(100).height(100)
4.自定义下载图片
Ima
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值