HarmonyOS鸿蒙Next中文件预览现是否支持不打开新窗口预览

HarmonyOS鸿蒙Next中文件预览现是否支持不打开新窗口预览

readWriteFile(srcFileString: string, destFileString: string, fileName: string): void {
  console.log(destFileString, 'wudibawanglong', fileName)
  let destPath = getContext(this).resourceDir + '/fang.txt'
  if (!fs.accessSync(destPath)) {
    console.log('不存在')
  }
  console.log(JSON.stringify(getContext(this).resourceDir), '11111111111')
  // 打开文件
  let srcFile = fs.openSync(srcFileString, fs.OpenMode.READ_WRITE | fs.OpenMode.CREATE);
  let destFile = fs.openSync(destFileString, fs.OpenMode.READ_WRITE | fs.OpenMode.CREATE);
  let context = getContext(this) as common.UIAbilityContext;
  let mType: string = '';
  let bufSize = 4096;
  let readSize = 0;
  let buf = new ArrayBuffer(bufSize);
  let readOptions: ReadOptions = {
    offset: readSize,
    length: bufSize
  };
  let readLen = fs.readSync(srcFile.fd, buf, readOptions);
  let uri = fileUri.getUriFromPath(destFileString);
  console.log(uri,'555555555555555')
  let fileInfo: filePreview.PreviewInfo = {
    title: fileName,
    uri: uri,
    mimeType: mType
  };
  while (readLen > 0) {
    readSize += readLen;
    let writeOptions: WriteOptions = {
      length: readLen
    };
    fs.writeSync(destFile.fd, buf, writeOptions);
    readOptions.offset = readSize;
    readLen = fs.readSync(srcFile.fd, buf, readOptions);
  }
  filePreview.openPreview(context, fileInfo).then(() => {
    hilog.info(0x0000, TAG, 'openPreview success');
  }).catch((err: BusinessError) => {
    console.log(JSON.stringify(fileInfo), 'wudibawanglong')
    hilog.error(0x0000, TAG, 'openPreview failed, err = %s', err.message);
  });
}

Text("点击唤起文件选择器")
  .fontSize(px2fp(42))
  .fontWeight(FontWeight.Bold)
  .alignRules({
    center: { anchor: '__container__', align: VerticalAlign.Center },
    middle: { anchor: '__container__', align: HorizontalAlign.Center }
  })
  .onClick(() => {
    const documentSelectOptions = new picker.DocumentSelectOptions();
    // 选择文档的最大数目(可选)
    documentSelectOptions.maxSelectNumber = 5;
    // 指定选择的文件或者目录路径(可选)
    documentSelectOptions.defaultFilePathUri = "file://docs/storage/Users/currentUser/test";
    // 选择文件的后缀类型['后缀类型描述|后缀类型'](可选) 若选择项存在多个后缀名,则每一个后缀名之间用英文逗号进行分隔(可选),后缀类型名不能超过100,选择所有文件:'所有文件(*.*)|.*';
    documentSelectOptions.fileSuffixFilters = ['.xlsx'];
    //选择是否对指定文件或目录授权,true为授权,当为true时,defaultFilePathUri为必选参数,拉起文管授权界面;false为非授权,拉起常规文管界面(可选)
    documentSelectOptions.authMode = false;

    let pathUri: Array<string> = [];
    let context = getContext(this) as common.Context;
    let baseDir = "/data/storage/el2/base/files/";
    // 创建文件选择器实例
    const documentViewPicker = new picker.DocumentViewPicker(context);
    documentViewPicker.select(documentSelectOptions).then((documentSelectResult: Array<string>) => {
      //文件选择成功后,返回被选中文档的uri结果集。
      pathUri = documentSelectResult;
      console.log('文件打印', JSON.stringify(pathUri))
      const filePath = pathUri[0]
      let fileName: string = filePath.split('/').pop() as string
      this.readWriteFile(pathUri[0], baseDir + fileName, fileName)
      console.log(pathUri[0], fileName + 'wudu')
      // fs.copy(pathUri[0],baseDir)
      console.info('documentViewPicker.select to file succeed and uris are:' + pathUri);
    }).catch((err: BusinessError) => {
      console.error(`Invoke documentViewPicker.select failed, code is ${err.code}, message is ${err.message}`);
    })
  })

filePreview.openPreview方法好像只能支持在一个新窗口打开并预览上传文件,怎么能让它打开的这个窗口嵌入页面内呢,或者有没有别的方法做这个文件预览的事情


更多关于HarmonyOS鸿蒙Next中文件预览现是否支持不打开新窗口预览的实战教程也可以访问 https://www.itying.com/category-93-b0.html

6 回复

想要切入式的话只有自定义了,不能用官方的可以结合ArkWeb和Node来实现,ArkWeb加载预览的文件,用Node来控制显示隐藏来控制更新
楼主可以参考一下这个方案:
使用离线Web组件-ArkWeb(方舟Web)-应用框架 - 华为HarmonyOS开发者

更多关于HarmonyOS鸿蒙Next中文件预览现是否支持不打开新窗口预览的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


可以新开一个 uiability.在新的里面打开预览试试

这个还真没有好办法了, filePreview.openPreview目前仅支持全屏模态窗口预览,无法直接嵌入页面组件容器。

这个没办法了,只能用相应的组件预览比如 常见的 用 webview加载办公软件。pdf用pdfkit服务。

HarmonyOS Next的文件预览功能支持在当前窗口直接预览,无需打开新窗口。系统通过文件管理器内嵌的预览组件实现,支持常见格式(如PDF、图片、文本等)的快速浏览。预览时保持原窗口布局,通过点击文件触发即时加载,状态栏会显示预览标识。开发者可通过@ohos.fileio接口调用预览功能,但需注意权限声明和MIME类型匹配。当前API版本已优化了多任务场景下的预览性能。

在HarmonyOS Next中,目前filePreview.openPreview接口确实默认会以新窗口形式打开文件预览。要实现嵌入式预览,可以考虑以下替代方案:

  1. 对于常见文件类型(如PDF、图片等),可以使用ArkUI的Web组件加载本地文件:
Web({ src: fileUri })
  .width('100%')
  .height('100%')
  1. 对于Office文档,可以先将文件上传到云端,然后通过Web组件加载在线预览服务(如Office 365预览服务)。

  2. 对于图片/视频等媒体文件,直接使用Image/Video组件:

Image(fileUri)
  .width('100%')
  .height('100%')
  1. 文本文件可以使用TextArea组件加载显示。

注意:直接预览某些格式可能需要先转换文件格式或使用第三方库。当前HarmonyOS文件预览API主要设计为系统级独立窗口体验,嵌入式预览需要开发者自行实现具体文件的渲染逻辑。

回到顶部