跳转到正文

@capgo/capacitor-pdf-viewer

在 iOS、Android 和 Web 上嵌入原生 PDF 查看功能,支持路径、URL、base64、内联模式、密码保护以及 underWebView 自定义 HTML UI

underWebView / toBack

打开方式 mode: 'underWebView' 或 toBack: true 将原生 PDF 置于透明的 Capacitor WebView 之后。 nativeUi 在此模式下默认为 false,以便您提供自己的 HTML 界面。

自定义 HTML 控件

使用 HTML(Ionic、Tailwind 或纯标记)绘制工具栏、页码指示器和按钮。原生层保留 PDFKit / Pdfium 的滚动、双指缩放和链接点击检测功能。

触摸路由

在 button, a、表单控件上 [data-capgo-pdf-interactive], .custom-toolbar,以及 .custom-pdf-ui button 保留在 WebView 中。其他触摸操作将传递给 PDF。

updateLayout()

相对于 WebView 视口,以 CSS 像素为单位重新定位或调整原生 PDF 的大小。请在旋转屏幕或界面(chrome)尺寸变化后调用。

在 iOS、Android 和 Web 上嵌入原生 PDF 查看功能,支持路径、URL、base64、内联模式、密码保护,以及可选的 underWebView 展示方式以自定义 HTML UI。

从 open() 以及下方列出的其他核心方法。

平台支持备注
iOS是PDFKit。 underWebView / toBack 已获支持。 hide() 以及 show() 仅在以下情况下接受 underWebView 或 inline 模式。
Android是Pdfium。 underWebView / toBack 受支持。 hide() 以及 show() 在任何打开模式下均可正常工作。
Web 端部分支持支持 blob URL 的浏览器 PDF 查看器。 underWebView / toBack 不可用。请使用 fullscreen 或 inline. nativeUi: false 配合 mode: 'fullscreen' 被拒绝。
  • open - 从文件、路径、URL 或 base64 源打开 PDF,包括 mode: 'underWebView' 或 toBack: true.
  • close - 关闭当前查看器并移除所有遮罩层。
  • goToPage / nextPage / previousPage - 跳转或按 1 起始的页码逐页浏览。
  • setZoom - 设置缩放倍数 (1 是原生默认适配比例)。
  • hide / show - 在不卸载文档的情况下隐藏或显示 PDF 图层。
  • updateLayout - 在以下位置重新定位或调整原生 PDF 的大小: underWebView / toBack 模式。
方法描述
open通过文件、路径、URL 或 base64 源打开 PDF。
close关闭当前查看器并移除所有遮罩层。
goToPage跳转到页码(从 1 开始计数)。
nextPage如果存在下一页,则移动到下一页。
previousPage如果存在上一页,则跳转到上一页。
setZoom设置缩放倍率。在 Web 端,此操作不会改变浏览器缩放。
getPageCount读取总页数。在 Web 端,此方法始终返回 1.
getCurrentPage读取当前页码(从 1 开始)。在 Web 端,仅反映最后一次通过代码设置的页面。
hide隐藏 PDF 图层,但不卸载文档。
show之后显示 PDF 图层 hide().
updateLayout使用……时,重新定位或调整原生 PDF 的大小 underWebView / toBack.
getPluginVersion获取原生或 Web 实现的版本标识。
addListener监听 load, pageChange, zoomChange, error, close,以及 linkTap 事件。

此参考文档同步自 src/definitions.ts 中的 capacitor-pdf-viewer.

如果你正在使用 @capgo/capacitor-pdf-viewer 在 Capacitor 应用中,将其与 使用 @capgo/capacitor-pdf-viewer 查看 SEO 教程及相关 Capgo 插件文档。