syncfusion-flutter-pdf-viewer

Syncfusion Flutter SfPdfViewer – UI 示例生成器

为用户的项目生成 Dart 代码 （默认）

触发关键词：“如何操作”、“添加 pdfviewer”、“代码示例”、“给我看看”、“示例”、“代码片段”、“集成”、“小部件”、“创建示例”、“flutter pdfviewer”。

**用途：**搭建一个可直接运行的 Flutter 项目，集成 syncfusion_flutter_pdfviewer，并在其中生成所请求的功能代码，一次完成所有操作。

工作流：

第 1 步 – 提出澄清问题（开始时只问一次）

在进行任何操作之前，先询问用户：

1. **项目目标：**是否已存在 Flutter 项目，还是需要创建一个新项目？
2. **文件位置：**生成的代码应该放入现有文件（例如 main.dart）还是新的 Dart 文件（例如 pdf_viewer_sample.dart）？
3. **平台：**应用面向移动端、桌面端还是 Web？（仅用于确定是否需要执行 Web 的 index.html 步骤。）

第 2 步 – 创建新的 Flutter 项目 （如果项目已存在则跳过）

在终端中运行：

flutter create pdf_viewer_app
cd pdf_viewer_app

第 3 步 – 添加 Syncfusion 依赖项 （如果 pubspec.yaml 中已存在则跳过）

在 pubspec.yaml 的 dependencies 下添加：

dependencies:
  flutter:
    sdk: flutter
  syncfusion_flutter_pdfviewer: ^33.2.8

然后运行：

flutter pub get

注意：

• 使用 pub.dev 上该软件包的最新稳定版本。

第 4 步 –（仅限 Web）更新 web/index.html

如果目标平台是 Web，请在 web/index.html 的 <body> 标签内添加 PdfJs 脚本：

<script type="module" async>
  import * as pdfjsLib from 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/4.10.38/pdf.min.mjs';
  pdfjsLib.GlobalWorkerOptions.workerSrc = "https://cdnjs.cloudflare.com/ajax/libs/pdf.js/4.10.38/pdf.worker.min.mjs";
</script>

第 5 步 – 编写 Dart 代码

1. 以 references/basic-sample.md 作为基础模板。
2. 确定所请求的功能，并将 references/*.md 中相关的代码片段合并到基础模板中。
3. 遵循以下代码生成规则：
   • 完全按照参考内容中的代码编写，不要更改 API 用法。
   • 仅添加请求所需的 API，不要包含额外内容。
   • 使用基于控制器的 API 时，始终在 initState() 中初始化 PdfViewerController。
4. 将最终代码写入第 1 步中选择的文件：
   • 现有文件（例如 main.dart）：使用编辑工具插入或替换代码。
   • 新 Dart 文件（例如 pdf_viewer_sample.dart）：使用创建文件工具创建该文件。
   • 切勿只在代码块中展示代码，始终使用相应工具将代码写入文件。

第 6 步 – 运行应用

flutter run

---

代码参考

所有模板和操作代码片段都位于 references/*.md 中。每个文件都包含一个专门的代码片段或模板，Agent 会在生成示例时将其组合起来。

**流程：**始终从 references/basic-sample.md 开始，然后将匹配的功能合并到其结构中。如果没有匹配的关键词，则只返回基础示例。

文件	用途
basic-sample.md	最简 SfPdfViewer，包含网络/资源 URL、Scaffold 和 AppBar。
magnification.md	使用 PdfViewerController 和组件属性配置缩放级别、最大缩放比例、双击缩放和缩放回调。
page-navigation.md	使用 jumpToPage、nextPage、previousPage、firstPage、lastPage 和 jumpTo 偏移方法以编程方式导航页面。
text-search.md	搜索文本，使用 nextInstance/previousInstance 导航搜索结果，取消搜索，以及自定义高亮颜色。
text-selection.md	启用/禁用文本选择，自定义选区颜色，处理 onTextSelectionChanged 回调。
bookmark-navigation.md	打开内置书签视图，并使用 jumpToBookmark 以编程方式导航到书签。
scrolling.md	使用 jumpTo 以编程方式滚动，并通过 scrollOffset 读取当前滚动偏移量。
pdfviewer-properties.md	常用 SfPdfViewer 组件属性参考：canShowScrollHead、canShowPaginationDialog、interactionMode、pageLayoutMode、initialZoomLevel、onDocumentLoaded、onDocumentLoadFailed、onPageChanged 等。
annotation.md	使用 PdfViewerController 方法和批注回调添加、移除、选择和管理文本标记（高亮、下划线、删除线、波浪线）及便笺批注。
signaturepad.md	使用 canShowSignaturePadDialog 隐藏内置签名板，并通过 onFormFieldFocusChange 显示自定义 SfSignaturePad 对话框，以捕获绘制的签名并将其分配给 PdfSignatureFormField。
password-protected-pdf.md	使用 password 属性打开加密的 PDF 文档，并通过 onDocumentLoadFailed 处理加载失败。
link-navigation.md	使用 enableDocumentLinkAnnotation 启用/禁用文档链接批注导航，并通过 onHyperlinkClicked 处理超链接点击。
form-filling.md	使用 PdfViewerController 方法和表单字段回调填写、编辑、保存、导出、导入和清除 AcroForm 字段（文本框、复选框、单选按钮、组合框、列表框、签名）。
localization.md	使用 flutter_localizations、syncfusion_localizations 和 MaterialApp 区域设置配置，将 SfPdfViewer 静态界面文本本地化为任何受支持的语言。
directionality.md	通过使用 Directionality 组件包裹 SfPdfViewer，或在 MaterialApp 中设置 RTL locale，启用从右到左（RTL）渲染。
accessibility.md	通过 Semantics 组件支持屏幕阅读器、键盘导航快捷键、大字体和触控目标标准，使 SfPdfViewer 具备无障碍访问能力。
gesture-callback.md	使用 onTap 回调和 PdfGestureDetails（页码、页面位置、组件位置）处理 PDF 查看器上的点击手势。

---