Android 上显示 PDF 文件

使用 WebView 配合 pdf.js 在 Android 上显示 PDF 文件git

最近在 手机上要显示 PDF 文件,在搜索引擎上找到了不少方案,大致上有如下几种:github

  • 使用提供的在线服务,例如 Google 文档预览服务,mWebView.loadUrl("http://docs.google.com/gview?embedded=true&url="+ pdfUrl);
  • 使用 AndroidPdfViewer,这是一个 GitHub 上开源的库,除了体积大点别的都挺好, https://github.com/barteksc/A...
  • 使用 Moliza 开源的 Pdf.js 这个库是很强大的,配合 WebView ,能够支持预览,缩放,翻页等等功能
  • 使用 腾讯浏览服务 https://x5.tencent.com/

我是选择了 pdf.js 这个库,使用 WebView 配合 H5 页面,能够作到随意的自定义,而且体积很小,放在服务器的话就更小了。npm

在这里记录下使用的过程也方便后来者。

考虑到网络不稳定的状况,因此我把 js 库下载下来了,不介意的能够直接使用网络库canvas

刚开始使用时,直接使用提供的 API 建立 canvas ,每一页建立一个 canvas 而后排列下来,由于有其余的内容要显示。
开发测试的时候由于文件小,而且是在电脑上浏览的没有发现什么问题,在手机上测试的时候使用了一个稍微大点的文件,内存立马就爆了。
由于是在加载完成后,每页都建立一个 canvas 显示,没有作到逐页加载,也没有作任何循环使用和销毁的处理,内存就爆了。跨域

在 pdf.js 的例子里看到了在手机上使用的例子,就改了改,它这个作到了循环使用 canvas,而且是逐页加载。
修改以后在手机上使用 32M 的文件轻松无压力。示例,传送门服务器

memory.png

简单写了个 Demo :https://github.com/skymxc/Exa...微信

assets 目录是修改后的页面。网络

显示网络文件仍是要下载到本地才能够,由于跨域访问的限制问题。测试

screen-1.jpg

End 微信扫一扫,关注个人公众号

微信扫一扫,关注个人公众号

相关文章
相关标签/搜索