鸿蒙PDF预览

PDFView


简介

PDFView ,是一款高性能预览pdf文件的库。

  • 支持在线PDF文件预览
  • 支持本地rawfile文件预览
  • 使用Lazy懒加载方式,优化性能
  • 支持分页加载
  • API 12

下载安装

ohpm install @hjm/pdfview


接口和属性列表

接口列表

接口 参数 描述
pdfInit (totalPage: 总页数,pagesPerLoad: 当前分页数) PDF初始化数据回调函数
onReachEnd (totalPage: 总页数) PDF滑动到底部回调函数
onScrollIndex (pageIndex: 当前滚动索引值) PDF滑动时回调函数

属性列表

属性 描述
pdfUrl PDF文件地址(在线地址或者本地地址)
pagesPerLoad 分页加载数量

性能分析


  • 结合HarmonyOS官方文档要求,应用CPU占用峰值应< 2%为性能最优体验,使用PDFView加载100页的PDF性能表现如下:


    PDFViewProfiler.png

使用示例


import { PDFView } from '@hjm/pdfview'

@Entry
@Component
struct Test8Page {
  // @State pdfUrl: string = 'https:XXXX/test/demo.pdf';  //在线地址
  @State pdfUrl: Resource = $rawfile('demo.pdf');  //本地地址

  build() {
    Column(){
      Row(){
        PDFView({
          /* 数据源 */
          pdfUrl:this.pdfUrl,
          /* 实现分页加载功能,以缩短首页加载时间。 */
          pagesPerLoad: 10,
          /**
           * PDF初始化数据回调函数。`
           * @param {number} totalPage - PDF文档的总页数。
           * @param {number} pagesPerLoad - 每次分页加载的页数。
           */
          pdfInit: (totalPage: number,pagesPerLoad: number) => {
            console.log('总页数为:',totalPage,',当前分页数为:',pagesPerLoad)
          },
          /**
           * PDF滑动到底部回调函数。
           * @param {number} totalPage - PDF文档的总页数。
           */
          onReachEnd: (totalPage: number) => {
            console.log('总页数为:',totalPage)
          },
          /**
           * PDF滑动时回调函数。
           * @param {number} pageIndex - PDF文档当前滚动索引值。
           */
          onScrollIndex: (pageIndex: number) => {
            console.log(`当前滚动到第${pageIndex}页`)
          },
        })
      }
      .width('100%')
      .height('100%')

    }
    .width('100%')
    .height('100%')
  }
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容