跨平台OFD、PDF文档预览UTS插件

〇、介绍

Seal-OfdReader是跨平台OFD文档预览原生插件,具有以下特点:

  • 支持UniApp项目集成,也支持原生Android项目集成

  • 非腾讯X5,无内核加载,高效率、稳定高可用

  • 支持在线文档,也支持离线设备本地文档

  • 支持Android和IOS

  • 支持全屏预览,也支持组件嵌入方式预览

  • 支持顶部状态栏自定义菜单功能按钮

  • 支持水印防截屏自定义状态栏自定义菜单功能按钮等诸多可选配置

  • 支持国产OFD以及PDF文档格式

作者其他插件,欢迎使用:

1、文档预览原生Android项目离线集成,Demo工程及README文档地址: Seal-Office-Android-Demo
2、跨平台Office文档预览原生插件【非X5离线、组件嵌入、水印、WPS预览编辑】,插件地址:Seal-OfficeOnline
3、跨平台系统接口:获取静音模式、免打扰状态、音量等UTS插件,插件地址:seal-system-api-uts
4、Android和IOS图片预览,音视频播放原生插件【非腾讯X5,无内核加载】,插件地址:Seal-ImageVideo
5、跨平台Android和IOS百度OCR文字识别、证卡识别、票据识别原生插件,插件地址:Seal-OCR
6、跨平台Android和IOS百度语音在线识别原生插件,插件地址:Seal-VoiceASR

各位同学,对于插件使用还有疑问的,可以加QQ群(170683293)咨询,也可以扫下面二维码添加WX或者添加QQ(2480621579)。

一、快速上手

插件名称:seal-ofd-reader-api-uts

Step1. 点击右上角【使用HBuilderX导入示例项目】

Step2. 打开manifest.json文件,重新获取AppID

Step3. 制作自定义调试基座

点击"运行-》运行到手机或模拟器-》制作自定义调试基座"

Step4. 运行调试

连接真机,点击"运行-》运行到手机或模拟器-》运行到Android App(或iOS App)基座-》选择'使用自定义基座运行'"

二、插件接口

  • openFile方法:支持Android和IOS,预览OFD、PDF格式文档,IOS端不支持PDF。

三、使用方法

openFIle文档预览(离线、在线)

参数参考章节《三、openFile接口参数说明》

支持平台:Android、IOS

支持OFD,PDF,注意:IOS不支持PDF

index.uvue

javascript 复制代码
uni.showLoading({
  title: '正在下载文件,请稍后~'
});
uni.downloadFile({
  url: 'http://silianpan.cn/upload/2022/01/01/1.ofd',
  success: res => {
    if (res.statusCode === 200) {
      // 直接传递本地文件地址
      // 传递本地文件绝对路径,res.tempFilePath的前缀是_doc,而实际目录为doc,没有下划线_,所以要substr取子串
      // const url = '/storage/sdcard0/Android/data/APP包名/apps/APPID/' + res.tempFilePath.substr(1)
      // 可以通过以下方式获取文件绝对路径
      uni.saveFile({
        // 需要保存文件的临时路径
        tempFilePath: res.tempFilePath,
        success: resSave => {
          uni.hideLoading();
          const savedFilePath = resSave.savedFilePath;
          // 转换为绝对路径
          const fileLocalPath = plus.io.convertLocalFileSystemURL(savedFilePath);
          console.log('tempFilePath', res.tempFilePath);
          console.log('savedFilePath', savedFilePath);
          console.log('fileLocalPath', fileLocalPath);
          // 预览本地文件
          openFile({
            filePath: fileLocalPath,
            title: 'OFD/PDF文档在线预览',
            topBarBgColor: '#3394EC',
            waterMarkText: '你好,世界\n准备好了吗?时刻准备着',
          } as OpenFileParams)
        }
      });
    }
  }
});

index.vue

js 复制代码
uni.showLoading({
  title: '正在下载文件,请稍后~'
});
uni.downloadFile({
  url: 'http://silianpan.cn/upload/2022/01/01/1.ofd',
  success: res => {
    if (res.statusCode === 200) {
      // 直接传递本地文件地址
      // 传递本地文件绝对路径,res.tempFilePath的前缀是_doc,而实际目录为doc,没有下划线_,所以要substr取子串
      // const url = '/storage/sdcard0/Android/data/APP包名/apps/APPID/' + res.tempFilePath.substr(1)
      // 可以通过以下方式获取文件绝对路径
      uni.saveFile({
        // 需要保存文件的临时路径
        tempFilePath: res.tempFilePath,
        success: resSave => {
          uni.hideLoading();
          const savedFilePath = resSave.savedFilePath;
          // 转换为绝对路径
          const fileLocalPath = plus.io.convertLocalFileSystemURL(savedFilePath);
          console.log('tempFilePath', res.tempFilePath);
          console.log('savedFilePath', savedFilePath);
          console.log('fileLocalPath', fileLocalPath);
          // 预览本地文件
          openFile({
            filePath: fileLocalPath,
            title: 'OFD/PDF文档在线预览',
            topBarBgColor: '#3394EC',
            waterMarkText: '你好,世界\n准备好了吗?时刻准备着',
          })
        }
      });
    }
  }
});

四、openFile接口参数说明

支持打开在线文档,本地文档

支持平台:Android、IOS

参数名 说明 类型 是否必填 默认值 可选值
filePath 本地文件路径,如:/data/user/0/APP包名/files/1.ofd string
docDownloadTitle 文档加载进度框标题,IOS端无此配置 string 加载文档
waterMarkText 水印文本,默认以**\n**作为分隔符换行 string null
waterMarkTextSep 水印文本分隔符,注意:IOS端只支持\n换行 string \n
waterMarkFontSize 水印字体大小,单位为sp 使用sp作为字体大小单位,会随着系统的字体大小改变 int 13
waterMarkFontColor 水印字体颜色 string #40F3F5F9
waterMarkDegree 水印旋转角度,IOS端无此配置 string -30(逆时针30度)
isTopBar 是否显示顶栏,IOS端无此配置 bool true false
title 顶栏标题,isTopBar为true时有效 string APP名称
topBarHeight 顶栏自定义高度,isTopBar为true时有效,类型为正整数,IOS端无此配置 int actionBarSize
topBarBgColor 顶栏背景颜色,isTopBar为true时有效 string #3394EC(科技蓝)
topBarTextColor 顶栏文本颜色(isTopBar为true时有效) string #FFFFFF(白色)
topBarTextLength 顶栏标题文字长度(isTopBar为true时有效),IOS端无此配置 int 12
isBackArrow 是否显示返回按钮(isTopBar为true时有效),IOS端无此配置 bool true false

五、预览效果

Android

  • 预览ofd

  • 嵌入预览

  • 预览pdf

IOS

  • 预览ofd

  • 嵌入预览

相关推荐
zepcjsj08016 分钟前
简单实现支付密码的页面及输入效果
android
小阳睡不醒1 小时前
小白成长之路-部署Zabbix7(二)
android·运维
他们都不看好你,偏偏你最不争气1 小时前
iOS —— 天气预报仿写总结
ios
mmoyula2 小时前
【RK3568 PWM 子系统(SG90)驱动开发详解】
android·linux·驱动开发
VB5943 小时前
《考研 考证 各学科 各专业 思维导图汇总》PDF 5.2GB
考研·pdf
你过来啊你5 小时前
Android用户鉴权实现方案深度分析
android·鉴权
kerli7 小时前
Android 嵌套滑动设计思想
android·客户端
白玉cfc7 小时前
【iOS】网易云仿写
ui·ios·objective-c
恣艺8 小时前
LeetCode 854:相似度为 K 的字符串
android·算法·leetcode
阿华的代码王国9 小时前
【Android】相对布局应用-登录界面
android·xml·java