xycc博客

Appearance

待添加

鸿蒙加载网络图片并转换成PixelMap ​

参考文档

基于API12.

有一些图片功能需要使用 PixelMap 类型的参数，但是使用Image组件之类的时候无法获取到 PixelMap 类型数据。 因此只能是把图片下载下来然后加在并转换一下。

实现方式 ​

一下封装了一个函数。使用的 rcp 模块，现在所有的请求都推荐使用这个网络请求的模块。之后就能方便的获取到 PixelMap 类型的数据了。而且这个类型的数据还能直接给 Image 组件使用。

javascript
requestImageUrl(url: string) : Promise<image.PixelMap> {
  return new Promise<image.PixelMap>((resolve, reject) => {
    rcp.createSession().get(url).then((response) => {
      console.info(`Succeeded in getting the response ${response}`);
      let imgData: ArrayBuffer = response.body as ArrayBuffer
      console.info(`request image success, size: ${imgData.byteLength}`);
      let imgSource: image.ImageSource = image.createImageSource(imgData);
      imgSource.createPixelMap().then((pixelMap: PixelMap) => {
        console.error('image createPixelMap success');
        resolve(pixelMap)
      }).catch((err: BusinessError) => {
        console.error(`err: err code is ${err.code}, err message is ${JSON.stringify(err)}`);
        reject(err)
      });
    }).catch((err: BusinessError) => {
      console.error(`err: err code is ${err.code}, err message is ${JSON.stringify(err)}`);
      reject(err)
    });
  })
}

使用方式 ​

使用方式如下：

javascript
let img = await this.requestImageUrl('http://gips2.baidu.com/it/u=3944689179,983354166&fm=3028&app=3028&f=JPEG&fmt=auto?w=1024&h=1024')

// build 里边
Image(img)

结果如下：