Flutter PDF阅读与管理插件flutter_pdf_kit的使用

Flutter PDF阅读与管理插件flutter_pdf_kit的使用

Flutter

Pub build Star on Github License: MIT

这是一个用于iOS和macOS的Flutter包，用于将CoreImage滤镜应用于图像。

使用方法 #

显示PDF文档 #

import 'package:flutter_pdf_kit/flutter_pdf_kit.dart';

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    // 使用CupertinoPdfView显示本地的PDF文件
    return const CupertinoPdfView.asset('assets/dummy.pdf');
  }
}

在这个示例中，我们创建了一个简单的Flutter应用，该应用使用CupertinoPdfView.asset来显示一个名为dummy.pdf的本地PDF文件。确保在项目的assets目录下放置了这个PDF文件，并在pubspec.yaml中正确配置了资源文件。

完整示例代码 #

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

void main() {
  runApp(const MyApp());
}

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

  [@override](/user/override)
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  [@override](/user/override)
  void initState() {
    super.initState();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('PDF阅读与管理插件示例'),
        ),
        body: const CupertinoPdfView.asset('assets/dummy.pdf'),
      ),
    );
  }
}

更多关于Flutter PDF阅读与管理插件flutter_pdf_kit的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter PDF阅读与管理插件flutter_pdf_kit的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


flutter_pdf_kit 是一个用于在 Flutter 应用中显示和管理 PDF 文件的插件。它提供了多种功能，如加载和显示 PDF 文件、支持缩放、滚动、搜索文本等。以下是如何在 Flutter 项目中使用 flutter_pdf_kit 的基本步骤。

1. 添加依赖

首先，在你的 pubspec.yaml 文件中添加 flutter_pdf_kit 依赖：

dependencies:
  flutter:
    sdk: flutter
  flutter_pdf_kit: ^1.0.0  # 请使用最新版本

然后运行 flutter pub get 来安装依赖。

2. 导入包

在你的 Dart 文件中导入 flutter_pdf_kit：

import 'package:flutter_pdf_kit/flutter_pdf_kit.dart';

3. 使用 PDFView 显示 PDF

你可以使用 PDFView 小部件来显示 PDF 文件。以下是一个简单的示例：

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

class PdfViewerScreen extends StatelessWidget {
  final String pdfPath;

  PdfViewerScreen({required this.pdfPath});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('PDF Viewer'),
      ),
      body: PDFView(
        filePath: pdfPath,
        enableSwipe: true,
        swipeHorizontal: false,
        autoSpacing: false,
        pageFling: true,
        onPageChanged: (int page, int total) {
          print('Page changed: $page/$total');
        },
        onError: (error) {
          print(error.toString());
        },
        onPageError: (page, error) {
          print('$page: ${error.toString()}');
        },
        onRenderer: (PDFViewController controller) {
          // You can store the controller for later use
        },
      ),
    );
  }
}

4. 传递 PDF 文件路径

在调用 PdfViewerScreen 时，传递 PDF 文件的路径：

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: PdfViewerScreen(
        pdfPath: 'assets/sample.pdf',
      ),
    );
  }
}

5. 处理 PDF 文件

你可以从本地文件系统、网络或应用程序的 assets 中加载 PDF 文件。例如，从 assets 加载 PDF 文件：

class PdfViewerScreen extends StatelessWidget {
  final String pdfPath;

  PdfViewerScreen({required this.pdfPath});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('PDF Viewer'),
      ),
      body: FutureBuilder<String>(
        future: _loadPdfFromAssets(),
        builder: (context, snapshot) {
          if (snapshot.connectionState == ConnectionState.done) {
            return PDFView(
              filePath: snapshot.data!,
              enableSwipe: true,
              swipeHorizontal: false,
              autoSpacing: false,
              pageFling: true,
              onPageChanged: (int page, int total) {
                print('Page changed: $page/$total');
              },
              onError: (error) {
                print(error.toString());
              },
              onPageError: (page, error) {
                print('$page: ${error.toString()}');
              },
              onRenderer: (PDFViewController controller) {
                // You can store the controller for later use
              },
            );
          } else {
            return Center(child: CircularProgressIndicator());
          }
        },
      ),
    );
  }

  Future<String> _loadPdfFromAssets() async {
    return 'assets/sample.pdf';
  }
}

6. 处理 PDF 控制

你可以通过 PDFViewController 来控制 PDF 的显示，例如跳转到特定页面、缩放等。你可以在 onRenderer 回调中获取控制器：

PDFViewController? _pdfViewController;

[@override](/user/override)
Widget build(BuildContext context) {
  return PDFView(
    filePath: pdfPath,
    onRenderer: (controller) {
      _pdfViewController = controller;
    },
  );
}

void jumpToPage(int page) {
  _pdfViewController?.setPage(page);
}
回到顶部