前言

作者之前有教程介绍了如何将图片PixelMap进行Base64编码后加载,有小伙伴想了解如何进行反向转换,下文会提供一个工具方法来进行说明指导。

开发环境

系统版本: 4.1-Release

DevEco Studio版本: 4.0 Release (build:4.0.0.600)

SDK版本: 4.0.10.15(及以上)

方法示例

base64ToPixelMap(base64: string): Promise<image.PixelMap> {
  // 将原始图片base64字符串转变为通过base64字符串
  const reg = new RegExp('data:image/\\w+;base64,')
  const base64Str = base64.replace(reg, '')
  // 将通用base64字符串转变为arrayBuffer
  let base64Helper = new util.Base64Helper();
  let uint8Array = base64Helper.decodeSync(base64Str)
  let arrayBuffer = uint8Array.buffer
  // 将arrayBuffer转变为pixelMap
  let imageSource = image.createImageSource(arrayBuffer)
  let opts: image.DecodingOptions = { editable: false }
  // 注意:这里return的是Promise,因此使用时需要在业务侧拿到最终的PixelMap
  return imageSource.createPixelMap(opts);
}

参考文献

Image: https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-image-kit/js-apis-image.md

Base64Helper: https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/reference/apis-arkts/js-apis-util.md#base64helper9

示例Demo

https://gitee.com/winslei/open-harmony_-winsleikit/blob/455fae554b26ecac77903a5da5f8f502753721da/entry/src/main/ets/pages/Utils/UtilsHome.ets

Logo

社区规范:仅讨论OpenHarmony相关问题。

更多推荐