GitLocker: The Coding Marketplace

Description:

native pdf view

Plugin renamed and republished as [pdfx] #
[pdfx] on pub.dev
Some smaller api changes

Migration:

Replace dependencies

dependencies:
- native_pdf_view: ^4.0.1
+ pdfx: ^1.0.0
copied to clipboard

Renamed PdfPageFormat -> PdfPageImageFormat
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 #

In your flutter project add the dependency:
flutter pub add native_pdf_view
copied to clipboard
For web run tool for automatically add pdfjs library in index.html:
flutter pub run native_pdf_view:install_web
copied to clipboard
For windows run tool automatically add override for pdfium version property in CMakeLists.txt file:
flutter pub run native_pdf_view:install_web
copied to clipboard
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,
);
copied to clipboard
Package usage [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)
copied to clipboard
Network document open:
Install [network_file] package (supports all platforms):
flutter pub add internet_file
copied to clipboard
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 * 2height: page.height * 2format: PdfPageFormat.JPEGbackgroundColor: '#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 #
pdfController.openDocument(PdfDocument.openAsset('assets/sample.pdf'));
copied to clipboard
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);
copied to clipboard
Additional pdf info: #
// Actual showed page
pdfController.page;

// Count of all pages in document
pdfController.pagesCount;
copied to clipboard
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');
copied to clipboard
Custom renderer options #
PdfView(
controller: pdfController,
renderer: (PdfPage page) => page.render(
width: page.width * 2,
height: page.height * 2,
format: PdfPageFormat.JPEG,
backgroundColor: '#FFFFFF',
),
);
copied to clipboard
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'),
),
);
copied to clipboard
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