HarmonyOS 在一个新的@Entry页面,使用Image组件首次加载本地uri图片时显示空白

在一个新的@Entry页面,使用Image组件首次加载本地uri图片时显示空白。

但是,先加载网络地址之后,再换成本地uri地址,就可以正常显示。已排除uri路径和文件的问题,图片路径如下:

file://media/Photo/6/IMG_1715589716_005/IMG_20240513_164016.jpg


HarmonyOS
2024-10-28 10:43:34
浏览
已于2024-10-28 16:55:56修改
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
zxjiu

​请问是否调用了@ohos.file.fileuri模块的fileuri.getUriFromPath(file.path)将沙箱路径转化为沙箱uri,接口参考如下:

https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-file-fileuri-V5

您可参考以下代码:​

@Entry  
@Component  
struct Index {  
  @State imagePath: string = ''  
  private context = getContext(this) as common.UIAbilityContext;  
  
  build() {  
    Row() {  
      Column() {  
        Image(this.imagePath)  
          .width(200)  
          .height(300)  
          .objectFit(ImageFit.Cover)  
          .backgroundColor(Color.Pink)  
          .margin({ bottom: 20 })  
        Button("选择图片")  
          .onClick(() => {  
            this.selectPhoto()  
          })  
      }.width('100%')  
    }.height('100%')  
  }  
  selectPhoto() {  
    const photoSelectOptions = new picker.PhotoSelectOptions();  
    const photoViewPicker = new picker.PhotoViewPicker();  
    photoSelectOptions.MIMEType = picker.PhotoViewMIMETypes.IMAGE_TYPE; // 过滤选择媒体文件类型为IMAGE  
    photoSelectOptions.maxSelectNumber = 1; // 选择媒体文件的最大数目  
    photoViewPicker.select(photoSelectOptions).then((photoSelectResult: picker.PhotoSelectResult) => {  
      const fileUri = photoSelectResult.photoUris[0]  
      this.getFileInfo(fileUri)  
    })  
  }  
  async getFileInfo(filePathString: string) {  
    let resFile = fs.openSync(filePathString, fs.OpenMode.READ_ONLY)  
    const dateStr = (new Date().getTime()).toString()  
    // 临时文件目录  
    let newPath = this.context.filesDir + `/${dateStr + resFile.name}`;  
    // 转化路径  
    fs.copyFileSync(resFile.fd, newPath);  
    // 新的路径  
    let realUri = 'file://' + newPath;  
    this.imagePath = realUri  
    console.log(this.imagePath)  
  }  
}
分享
微博
QQ
微信
回复
2024-10-28 15:06:17
相关问题
HarmonyOS Image显示GIF图片时控制
98浏览 • 1回复 待解决
使用Web组件加载网页,显示空白
375浏览 • 1回复 待解决
HarmonyOS Image加载本地图片咨询
353浏览 • 1回复 待解决
服务卡片设置本地图片显示空白
7268浏览 • 2回复 已解决
HarmonyOS加载Image组件图片
391浏览 • 1回复 待解决
MongoDB中如何创建一个数据库?
3823浏览 • 1回复 待解决
HarmonyOS image组件图片加载性能数据
185浏览 • 1回复 待解决
HarmonyOS web加载页面图片显示
347浏览 • 1回复 待解决
HarmonyOS 需要一个图片预览组件
120浏览 • 1回复 待解决