【Flutter】flutter加载PDF文件-flutter_cached_pdfview

564 阅读2分钟

【Flutter】flutter加载PDF文件-flutter_cached_pdfview

  1. 添加依赖 首先,在 pubspec.yaml 文件中添加 flutter_cached_pdfview 依赖:

yaml文件

dependencies:
  flutter:
    sdk: flutter
  flutter_cached_pdfview: ^0.4.2

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

  1. 导入包 在你要使用 PDF 查看器的 Dart 文件中导入该包:

dart

import 'package:flutter_cached_pdfview/flutter_cached_pdfview.dart';
  1. 显示来自 URL 或资产的 PDF 你可以使用 PDF().fromUrl() 方法加载来自 URL 的 PDF,或者使用 PDF().fromAsset() 方法加载应用内的 PDF 文件。

从 URL 加载 PDF

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

class PDFViewerFromUrl extends StatelessWidget {
  final String url;

  PDFViewerFromUrl({required this.url});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('PDF 查看器')),
      body: PDF().fromUrl(
        url,
        placeholder: (double progress) => Center(child: Text('$progress %')),
        errorWidget: (dynamic error) => Center(child: Text(error.toString())),
      ),
    );
  }
}

从Aeest文件加载 PDF


复制代码
import 'package:flutter/material.dart';
import 'package:flutter_cached_pdfview/flutter_cached_pdfview.dart';

class PDFViewerFromAsset extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('PDF 查看器')),
      body: PDF().fromAsset(
        'assets/sample.pdf',
        placeholder: (double progress) => Center(child: Text('$progress %')),
        errorWidget: (dynamic error) => Center(child: Text(error.toString())),
      ),
    );
  }
}
  1. 处理文件缓存 flutter_cached_pdfview 在从 URL 加载 PDF 时会自动缓存文件。下次加载相同的 PDF 时,将从缓存中读取,而不是重新下载,从而提高性能并节省带宽。

  2. 处理权限(如果需要) 如果你需要从设备存储中加载 PDF,请确保应用具有必要的权限。你可能需要使用 permission_handler 包来请求和检查存储权限。

  3. 示例用法 下面是一个完整的示例,展示如何集成和使用 flutter_cached_pdfview:

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

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Cached PDF View',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: PDFViewerPage(),
    );
  }
}

class PDFViewerPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('PDF 查看器'),
      ),
      body: PDF().fromUrl(
        'https://www.example.com/sample.pdf',
        placeholder: (progress) => Center(child: Text('$progress %')),
        errorWidget: (error) => Center(child: Text(error.toString())),
      ),
    );
  }
}
  1. 额外配置 占位符: placeholder 参数用于在 PDF 加载过程中显示一个占位符,可以是进度指示器或其他小部件。 错误处理: errorWidget 参数允许你在加载 PDF 出错时显示特定内容。
  2. 构建并运行 完成包的集成和 PDF 查看器的配置后,你可以构建并运行你的 Flutter 项目:

eg1:

import 'package:base/base.dart';
import 'package:file_preview/src/util/file_preview_util.dart';
import 'package:file_preview/src/widget/placeholder_widget.dart';
import 'package:file_preview/src/widget/file_preview_title_widget.dart';
import 'package:flutter/material.dart';
import 'package:flutter_cached_pdfview/flutter_cached_pdfview.dart';
import '../../r.dart';

///从网络上加载pdf文件
class PDFViewerCachedFromUrl extends StatelessWidget {
  final String url;

  final GlobalKey _contextMenuKey = GlobalKey();

  PDFViewerCachedFromUrl({super.key, required this.url});

  @override
  Widget build(BuildContext context) {
    final String fileName = FilePreviewUtils.getFileName(url);
    return Scaffold(
      appBar: FilePreviewTitleWidget(title: fileName),
      body: const PDF().cachedFromUrl(url,
          placeholder: (double progress) => FilePreviewPlaceHolderWidget(
                fileName: fileName,
                icon: R.iconPdf,
                progress: progress,
                bottomWidget: Container(
                  decoration: BoxDecoration(color: const Color(0xFFFF540A), borderRadius: BorderRadius.circular(10.r)),
                ),
              ),
          errorWidget: (dynamic error) => Center(child: Text(error.toString())),
          whenDone: (String filePath) {
            print("AAAurl文件缓存路径=$filePath");
          }),
    );
  }
}

eg2:

import 'dart:async';

import 'package:base/base.dart';
import 'package:file_preview/src/util/file_preview_util.dart';
import 'package:file_preview/src/widget/placeholder_widget.dart';
import 'package:file_preview/src/widget/file_preview_title_widget.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_cached_pdfview/flutter_cached_pdfview.dart';
import '../../r.dart';

///从本地加载pdf文件
class PDFViewerFromPath extends StatelessWidget {
  final String path;
  final Completer<PDFViewController> _pdfViewController = Completer<PDFViewController>();
  final StreamController<String> _pageCountController = StreamController<String>();

  PDFViewerFromPath({super.key, required this.path});

  @override
  Widget build(BuildContext context) {
    final String fileName = FilePreviewUtils.getFileName(path);
    return Scaffold(
      appBar: FilePreviewTitleWidget(title: fileName),
      body: PDF(
        enableSwipe: true,
        swipeHorizontal: false,
        autoSpacing: true,
        pageFling: true,
        pageSnap: true,
        fitPolicy: FitPolicy.BOTH,
        preventLinkNavigation: false,
        onPageChanged: (int? current, int? total) => _pageCountController.add('${current! + 1} - $total'),
        onViewCreated: (PDFViewController pdfViewController) async {
          _pdfViewController.complete(pdfViewController);
          final int currentPage = await pdfViewController.getCurrentPage() ?? 0;
          final int? pageCount = await pdfViewController.getPageCount();
          _pageCountController.add('${currentPage + 1} - $pageCount');
        },
        onError: (err) {
          print('AAA-PDFViewerFromPath err=$err');
        },
      ).fromPath(path),
    );
  }
}