HarmonyOS 加载本地文件目录的图片问题

app在服务器下载了一张图片保存在文件目录下面(/data/storage/el2/base/haps/Home/files/MZ_2121212.png),想使用Image显示出来,有具体的显示方案吗?

HarmonyOS
1天前
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
put_get

1、图片下载完成之后可以将图片保存到沙箱,获取到保存到沙箱的图片uri,然后再使用识别本地图片能力识别图片二维码即可。

2、以下代码可以作为参考使用,实际开发时可以做相应优化。

参考示例如下:

import { scanCore, scanBarcode, detectBarcode } from '@kit.ScanKit';
// 导入功能涉及的权限申请、回调接口
import { BusinessError } from '@kit.BasicServicesKit';
import { hilog } from '@kit.PerformanceAnalysisKit';
import { image } from '@kit.ImageKit';
import { http } from '@kit.NetworkKit';
import { common } from '@kit.AbilityKit';
import { fileIo as fs, fileUri } from '@kit.CoreFileKit';

@Entry
@Component
struct ScanBarCodePage {
  @State pixelMap: image.PixelMap | string | undefined = undefined
  @State scanResult: string = ''

  loadImageWithUrl(url: string) {
    try {
      // 使用request下载图片并在回调函数中保存图片到相册
      http.createHttp().request(url,
        {
          method: http.RequestMethod.GET,
          connectTimeout: 60000,
          readTimeout: 60000
        }, (error: BusinessError, data: http.HttpResponse) => {
          this.loadImageCallback(error, data);
        })
    } catch (e) {
      console.log(`testTAG ====== e:${e}`);
    }
  }

  async loadImageCallback(error: BusinessError, data: http.HttpResponse) {
    if (http.ResponseCode.OK === data.responseCode) {
      let imageBuffer: ArrayBuffer = data.result as ArrayBuffer;
      this.saveImage(imageBuffer)
    } else {
      console.error("testTAG==error occurred when image downloaded!")
    }
  }

  async saveImage(imageBuffer: ArrayBuffer) {
    // 获取应用文件路径
    let context = getContext(this) as common.UIAbilityContext;
    let filesDir = context.filesDir;
    // 新建并打开文件
    let file = fs.openSync(filesDir + '/testimage.jpg', fs.OpenMode.READ_WRITE | fs.OpenMode.CREATE);
    // 写入一段内容至文件
    let writeLen = fs.writeSync(file.fd, imageBuffer);
    const imageUri = fileUri.getUriFromPath(filesDir + '/testimage.jpg')
    this.pixelMap = imageUri
    console.log(`testTAG: imageUri` + imageUri);
    // 关闭文件
    fs.closeSync(file);
    let options: scanBarcode.ScanOptions = {
      scanTypes: [scanCore.ScanType.ALL],
      enableMultiMode: true,
    }
    let inputImage: detectBarcode.InputImage = { uri: imageUri }
    // 调用图片识码接口
    detectBarcode.decode(inputImage, options).then((result: Array<scanBarcode.ScanResult>) => {
      hilog.info(0x0001, 'testTAG',
        `Succeeded in getting ScanResult by promise with options, result is ${JSON.stringify(result)}`);
      this.scanResult = JSON.stringify(result)
    }).catch((error: BusinessError) => {
      hilog.error(0x0001, 'testTAG',
        `Failed to get ScanResult by promise with options. Code: ${error.code}, message: ${error.message}`);
    });
  }

  build() {
    Column() {
      Button('识别网络图像数据').onClick(() => {
        this.loadImageWithUrl("https://xxx")
      })
      Text(this.scanResult)
      // 获取生成码后显示
      if (this.pixelMap) {
        Image(this.pixelMap).width(300).height(300).objectFit(ImageFit.Contain)
      }
    }
    .backgroundColor('#DDDDDD')
    .width('100%')
    .height('100%')
  }
}
分享
微博
QQ
微信
回复
1天前
相关问题
HarmonyOS Image加载本地图片咨询
664浏览 • 1回复 待解决
HarmonyOS webview加载本地html问题
802浏览 • 1回复 待解决
HarmonyOS 图片加载问题
112浏览 • 1回复 待解决
HarmonyOS 下载到本地文件预览问题
266浏览 • 1回复 待解决