Flutter PDF阅读插件android_pdf_viewer的使用

Flutter PDF阅读插件android_pdf_viewer的使用

Native PDF View for iOS 和 Android

xscode Latest compatibility result for Stable channel Latest compatibility result for Beta channel Latest compatibility result for Dev channel

使用此包作为库

1. 依赖于它

在您的包的 pubspec.yaml 文件中添加以下内容:

dependencies:
  android_pdf_viewer: ^3.2.0

2. 安装它

您可以从命令行安装包:

使用 Flutter:

$ flutter packages get

或者,您的编辑器可能支持 pub get 或 flutter packages get。请参阅您的编辑器文档以了解更多信息。

3. 导入它

现在可以在 Dart 代码中使用:

import 'package:android_pdf_viewer/android_pdf_viewer.dart';

选项

名称 Android iOS 默认值
defaultPage ✅ ✅ 0
onViewCreated ✅ ✅ null
onRender ✅ ✅ null
onPageChanged ✅ ✅ null
onError ✅ ✅ null
onPageError ✅ ❌ null
onLinkHandle ✅ ✅ null
gestureRecognizers ✅ ✅ null
filePath ✅ ✅
pdfData ✅ ✅
fitPolicy ✅ ❌ FitPolicy.WIDTH
enableSwipe ✅ ✅ true
swipeHorizontal ✅ ✅ false
password ✅ ✅ null
nightMode ✅ ❌ false
autoSpacing ✅ ✅ true
pageFling ✅ ✅ true
pageSnap ✅ ❌ true
preventLinkNavigation ✅ ✅ false

控制器选项

名称 描述 参数 返回
getPageCount 获取总页数 - Future<int>
getCurrentPage 获取当前页码 - Future<int>
setPage 跳转到指定页码 int page Future<bool>

示例

PDFView(
  filePath: path,
  enableSwipe: true,
  swipeHorizontal: true,
  autoSpacing: false,
  pageFling: false,
  onRender: (_pages) {
    setState(() {
      pages = _pages;
      isReady = true;
    });
  },
  onError: (error) {
    print(error.toString());
  },
  onPageError: (page, error) {
    print('$page: ${error.toString()}');
  },
  onViewCreated: (PDFViewController pdfViewController) {
    _controller.complete(pdfViewController);
  },
  onPageChanged: (int page, int total) {
    print('page change: $page/$total');
  },
),

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

1 回复

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


在Flutter中,android_pdf_viewer 是一个用于在Android平台上显示PDF文件的插件。它提供了一个简单的方式来加载和显示PDF文档。以下是如何使用 android_pdf_viewer 插件的步骤:

1. 添加依赖

首先,你需要在 pubspec.yaml 文件中添加 android_pdf_viewer 插件的依赖:

dependencies:
  flutter:
    sdk: flutter
  android_pdf_viewer: ^1.0.0+17

然后运行 flutter pub get 来获取依赖。

2. 导入插件

在你的 Dart 文件中导入 android_pdf_viewer 插件:

import 'package:android_pdf_viewer/android_pdf_viewer.dart';

3. 加载并显示 PDF

你可以使用 AndroidPdfViewer.fromAsset 或 AndroidPdfViewer.fromFile 来加载和显示 PDF 文件。

从 Assets 加载 PDF

如果你的 PDF 文件放在 assets 文件夹中,你可以使用 AndroidPdfViewer.fromAsset 来加载它。

首先,确保在 pubspec.yaml 文件中声明了你的 PDF 文件:

flutter:
  assets:
    - assets/sample.pdf

然后,在代码中加载并显示 PDF:

class PdfViewerScreen extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('PDF Viewer'),
      ),
      body: FutureBuilder(
        future: AndroidPdfViewer.fromAsset('assets/sample.pdf'),
        builder: (context, snapshot) {
          if (snapshot.connectionState == ConnectionState.done) {
            return snapshot.data!;
          } else {
            return Center(child: CircularProgressIndicator());
          }
        },
      ),
    );
  }
}

从文件加载 PDF

如果你有一个本地的 PDF 文件,你可以使用 AndroidPdfViewer.fromFile 来加载它。

class PdfViewerScreen extends StatelessWidget {
  final File file;

  PdfViewerScreen({required this.file});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('PDF Viewer'),
      ),
      body: FutureBuilder(
        future: AndroidPdfViewer.fromFile(file),
        builder: (context, snapshot) {
          if (snapshot.connectionState == ConnectionState.done) {
            return snapshot.data!;
          } else {
            return Center(child: CircularProgressIndicator());
          }
        },
      ),
    );
  }
}

4. 导航到 PDF 查看器页面

你可以在应用中导航到这个 PDF 查看器页面:

Navigator.push(
  context,
  MaterialPageRoute(
    builder: (context) => PdfViewerScreen(file: File('/path/to/sample.pdf')),
  ),
);

5. 处理权限(如果需要)

如果你的 PDF 文件存储在外部存储中,你可能需要请求存储权限。你可以使用 permission_handler 插件来处理权限请求。

6. 注意事项

  • android_pdf_viewer 插件仅支持 Android 平台。如果你需要跨平台支持,可以考虑使用其他插件如 flutter_pdfview 或 syncfusion_flutter_pdfviewer。
  • 确保你的 PDF 文件路径正确,并且文件存在。

7. 示例代码

以下是一个完整的示例代码,展示如何从 assets 加载并显示 PDF:

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

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

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomeScreen(),
    );
  }
}

class HomeScreen extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('PDF Viewer Example'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => PdfViewerScreen(),
              ),
            );
          },
          child: Text('Open PDF'),
        ),
      ),
    );
  }
}

class PdfViewerScreen extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('PDF Viewer'),
      ),
      body: FutureBuilder(
        future: AndroidPdfViewer.fromAsset('assets/sample.pdf'),
        builder: (context, snapshot) {
          if (snapshot.connectionState == ConnectionState.done) {
            return snapshot.data!;
          } else {
            return Center(child: CircularProgressIndicator());
          }
        },
      ),
    );
  }
}
回到顶部