Plugin renamed and republished as [pdfx]

[pdfx on pub.dev](https://pub.dev/packages/pdfx)

Some smaller api changes

Migration:

  1. Replace dependencies
dependencies:
-   native_pdf_view: ^4.0.1
+   pdfx: ^1.0.0
  1. Renamed PdfPageFormat -> PdfPageImageFormat
  2. Re-case values PdfPageImageFormat{JPEG,PNG,WEBP} -> PdfPageImageFormat{jpeg,png,webp}

native_pdf_view

Flutter Plugin to render PDF and show a PDF file on Web, MacOs 10.11+, Android 5.0+, iOS and Windows.

Showcase

LiveScreenshot

Getting Started

pub package

In your flutter project add the dependency:

flutter pub add native_pdf_view

For web run tool for automatically add pdfjs library in index.html:

flutter pub run native_pdf_view:install_web

For windows run tool automatically add override for pdfium version property in CMakeLists.txt file:

flutter pub run native_pdf_view:install_web

Usage example

It very simple!

import 'package:native_pdf_view/native_pdf_view.dart';

final pdfController = PdfController(
  document: PdfDocument.openAsset('assets/sample.pdf'),
);

Widget pdfView() => PdfView(
  controller: pdfController,
);

Package usage [pdf_renderer](https://pub.dev/packages/pdf_renderer) and supports her api:

Local document open:

// From assets (Android, Ios, MacOs, Web)
PdfDocument.openAsset('assets/sample.pdf')

// From file (Android, Ios, MacOs)
PdfDocument.openFile('path/to/file/on/device')

// From data (Android, Ios, MacOs, Web)
PdfDocument.openData((FutureOr<Uint8List>) data)

Network document open:

Install [network_file](https://pub.dev/packages/internet_file) package (supports all platforms):

flutter pub add internet_file

Api

PdfController

ParameterDescriptionDefault
documentThe document to be displayed-
initialPageThe page to show when first creating the PdfView1
viewportFractionThe fraction of the viewport that each page should occupy.1.0

PdfView

ParameterDescriptionDefault
controllerPages control. See page control and additional pdf info-
onPageChangedCalled whenever the page in the center of the viewport changes. See Document callbacks-
onDocumentLoadedCalled when a document is loaded. See Document callbacks-
onDocumentErrorCalled when a document loading error. Exception is passed in the attributes-
documentLoaderWidget showing when pdf document loadingSizedBox()
pageLoaderWidget showing when pdf page loadingSizedBox()
builderCallback called to render a widget for each page. See custom page builderDefault builder
errorBuilderShow document loading error message inside PdfViewCentered error text
rendererCustom PdfRenderer library options. See custom renderer optionswidth: page.width * 2
height: page.height * 2
format: PdfPageFormat.JPEG
backgroundColor: '#ffffff'
scrollDirectionPage turning directionAxis.horizontal
physicsHow the widgets should respond to user input-
pageSnappingSet to false for mouse wheel scroll on webtrue

Additional examples

Open another document

pdfController.openDocument(PdfDocument.openAsset('assets/sample.pdf'));

Page control:

// Jump to specified page
pdfController.jumpTo(3);

// Animate to specified page
_pdfController.animateToPage(3, duration: Duration(milliseconds: 250), curve: Curves.ease);

// Animate to next page 
_pdfController.nextPage(duration: Duration(milliseconds: 250), curve: Curves.easeIn);

// Animate to previous page
_pdfController.previousPage(duration: Duration(milliseconds: 250), curve: Curves.easeOut);

Additional pdf info:

// Actual showed page
pdfController.page;

// Count of all pages in document
pdfController.pagesCount;

Document callbacks

int _actualPageNumber = 0, _allPagesCount = 0;

PdfView(
  controller: pdfController,
  onDocumentLoaded: (document) {
    setState(() {
      _allPagesCount = document.pagesCount;
    });
  },
  onPageChanged: (page) {
    setState(() {
      _actualPageNumber = page;
    });
  },
);

/// Now you can use these values to display the reading status of the document.
Text('Read: $_actualPageNumber of $_allPagesCount');

Custom renderer options

PdfView(
  controller: pdfController,
  renderer: (PdfPage page) => page.render(
    width: page.width * 2,
    height: page.height * 2,
    format: PdfPageFormat.JPEG,
    backgroundColor: '#FFFFFF',
  ),
);

Custom page builder:

PdfView(
  controller: pdfController,
  document: snapshot.data,
  pageBuilder: (
    Future<PdfPageImage> pageImage,
    int index,
    PdfDocument document,
  ) => PhotoViewGalleryPageOptions(
      imageProvider: PdfPageImageProvider(
        pageImage,
        index,
        document.id,
      ),
      minScale: PhotoViewComputedScale.contained * 1,
      maxScale: PhotoViewComputedScale.contained * 3.0,
      initialScale: PhotoViewComputedScale.contained * 1.0,
      heroAttributes: PhotoViewHeroAttributes(tag: '${document.id}-$index'),
    ),
);

Rendering additional info

On Web

This plugin uses the PDF.js

On Android

This plugin uses the Android native PdfRenderer

On Ios & MacOs

This plugin uses the IOS native CGPDFPage

On Windows

This plugin use PDFium

Libraries

native_pdf_view