native_pdf_view 6.0.0+1 icon indicating copy to clipboard operation
native_pdf_view: ^6.0.0+1 copied to clipboard

Flutter plugin to render PDF files on Web, MacOS, Windows, Android and iOS.

Plugin renamed and republished as [pdfx] #

[pdfx] on

Some smaller api changes


  1. Replace 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 #

Live Screenshot

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] and supports her api:

Local document open:

// From assets (Android, Ios, MacOs, Web)

// From file (Android, Ios, MacOs)

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

Network document open:

Install [network_file] package (supports all platforms):

flutter pub add internet_file

Api #

PdfController #

Parameter Description Default
document The document to be displayed -
initialPage The page to show when first creating the [PdfView] 1
viewportFraction The fraction of the viewport that each page should occupy. 1.0

PdfView #

Parameter Description Default
controller Pages control. See page control and additional pdf info -
onPageChanged Called whenever the page in the center of the viewport changes. See Document callbacks -
onDocumentLoaded Called when a document is loaded. See Document callbacks -
onDocumentError Called when a document loading error. Exception is passed in the attributes -
documentLoader Widget showing when pdf document loading SizedBox()
pageLoader Widget showing when pdf page loading SizedBox()
builder Callback called to render a widget for each page. See custom page builder Default builder
errorBuilder Show document loading error message inside PdfView Centered error text
renderer Custom PdfRenderer library options. See custom renderer options width: page.width * 2
height: page.height * 2
format: PdfPageFormat.JPEG
backgroundColor: '#ffffff'
scrollDirection Page turning direction Axis.horizontal
physics How the widgets should respond to user input -
pageSnapping Set to false for mouse wheel scroll on web true

Additional examples #

Open another document #


Page control: #

// Jump to specified page

// 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;

// Count of all pages in document

Document callbacks #

int _actualPageNumber = 0, _allPagesCount = 0;

  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 #

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

Custom page builder: #

  controller: pdfController,
  pageBuilder: (
    Future<PdfPageImage> pageImage,
    int index,
    PdfDocument document,
  ) => PhotoViewGalleryPageOptions(
      imageProvider: PdfPageImageProvider(
      minScale: PhotoViewComputedScale.contained * 1,
      maxScale: PhotoViewComputedScale.contained * 3.0,
      initialScale: PhotoViewComputedScale.contained * 1.0,
      heroAttributes: PhotoViewHeroAttributes(tag: '${}-$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

pub points


verified publisher

Flutter plugin to render PDF files on Web, MacOS, Windows, Android and iOS.

View/report issues


API reference


Icon for licenses.MIT (LICENSE)


flutter, pdfx


Packages that depend on native_pdf_view