Skip to content
DemoFAQ

PDF 生成模板编辑器

开源可视化 PDF 生成引擎,支持自定义模板,并提供面向开发者的 API,灵活构建文档生成流程。

查看 GitHub

集成 PDF 阅读器模块 ​

compdf_viewer 是基于 ComPDF Flutter SDK 封装的即用型 Flutter PDF 阅读器包。不需要从零构建 PDF 交互界面,将此包集成到您的项目后,即可获得完整的 PDF 阅读体验——包括注释、书签、全文搜索、缩略图导航等功能,开箱即用。

该包使用 GetX 进行路由管理、状态管理和依赖注入,内置英文和中文两种本地化翻译。

AndroidiOS
Android screenshotAndroid screenshot

功能概览 ​

类别详细说明
PDF 浏览单页、双页、连续滚动等多种显示模式
注释工具便签、高亮、下划线、删除线、手绘、图形(矩形、椭圆、直线、箭头)、图章、签名
文档导航BOTA 面板——书签、目录大纲、缩略图、注释列表
全文搜索带上下文摘要的全文检索,高亮显示搜索结果
文档安全密码保护、文档加密、权限设置
内容编辑直接编辑 PDF 文字和图像,支持撤销/重做
导出PDF 页面转图片、注释扁平化处理
界面支持深色模式,内置中英文翻译

包结构 ​

该包采用基于功能模块的架构,结合 GetX 模式。每个功能模块都是自包含的独立单元,拥有自己的控制器(Controller)、数据模型(Model)和 UI 组件(Widgets)。

bat
lib/
├── compdf_viewer.dart   # 公共 API 与导出
├── core/                # 全局配置、SDK 初始化、依赖绑定、常量
├── features/
│   ├── viewer/          # PDF 主渲染页面与控制器
│   ├── annotation/      # 注释工具栏及属性编辑器
│   ├── bota/            # 书签、大纲、缩略图、注释列表
│   ├── search/          # 全文搜索
│   ├── navigation/      # 侧边导航抽屉
│   ├── security/        # 密码/加密对话框
│   ├── convert/         # PDF 转图片导出
│   └── info/            # 文档元数据展示
├── l10n/                # 中英文国际化翻译
├── router/              # GetX 路由定义
├── shared/              # 可复用组件、控制器、对话框
└── utils/               # 文件、页面、屏幕工具类

核心类说明:

类职责
PdfViewerGlobalSDK 初始化与日志记录
PdfViewerControllerPDF 阅读器主状态与控制逻辑
PdfAnnotationToolBarController注释工具选择与属性管理
PdfSearchController文本搜索状态与结果导航
PdfViewerRoutes路由路径常量
PdfViewerPagesGetX 页面配置列表

环境要求 ​

要求最低版本
Flutter3.3.0
Dart SDK3.0.5
Android minSdkVersion23
iOS 最低部署版本13.0
ComPDF 授权许可必须 — 获取免费试用

快速开始 ​

添加依赖 ​

compdf_viewer 位于 ComPDF Flutter SDK 仓库 的 example/packages/compdf_viewer 目录下。将其复制到您的项目中,然后在 pubspec.yaml 中引用:

yaml
dependencies:
  flutter:
    sdk: flutter
  compdf_viewer:
    path: packages/compdf_viewer
  get: ^4.7.2

获取依赖包 ​

bash
flutter pub get

添加授权文件 ​

将您的 ComPDF 授权文件复制到应用的 assets 目录(例如 assets/license_key_flutter.xml),并在 pubspec.yaml 中声明:

yaml
flutter:
  assets:
    - assets/license_key_flutter.xml

初始化 SDK ​

在 runApp() 之前调用 PdfViewerGlobal.init():

dart
import 'package:compdf_viewer/compdf_viewer.dart';
import 'package:flutter/material.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  // 使用授权文件路径初始化 ComPDF
  await PdfViewerGlobal.init('assets/license_key_flutter.xml');

  runApp(const MyApp());
}

注册路由与翻译 ​

compdf_viewer 自带 GetX 路由和国际化支持,在您的 GetMaterialApp 中注册:

dart
import 'package:get/get.dart';
import 'package:compdf_viewer/compdf_viewer.dart';

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return GetMaterialApp(
      // 注册翻译(中文 + 英文)
      translations: PdfViewerTranslations(),
      locale: Get.deviceLocale,
      fallbackLocale: const Locale('en', 'US'),

      // 注册 PDF 阅读器路由
      getPages: [
        ...PdfViewerPages.routes,
        // ...您的其他路由
      ],

      home: const HomePage(),
    );
  }
}

打开 PDF ​

通过传入文件的绝对路径,导航到 PDF 阅读器页面:

dart
Get.toNamed(
  PdfViewerRoutes.pdfPage,
  arguments: {'document': '/absolute/path/to/document.pdf'},
);

完成!阅读器将以完整的注释工具栏、搜索、书签等所有内置功能打开。


依赖说明 ​

依赖包用途
compdfkit_flutterPDF 渲染与 SDK 核心功能
get状态管理、依赖注入与路由
shared_preferences阅读器设置持久化存储
flutter_colorpicker注释颜色选择器 UI
share_plusPDF 文件分享
file_picker从设备存储选择文件
path_provider访问设备目录
flutter_svg渲染工具栏 SVG 图标
logger调试与错误日志

延伸阅读 ​