Some test text!

menu
APIkeyboard_arrow_down

API for React Native PDF viewer

linkDocumentView

A component for displaying documents of different types such as PDF, docx, pptx, xlsx and various image formats.

linkProps

linkdocument

string, required

linkpassword

string, optional

linkleadingNavButtonIcon

string, optional

linkonLeadingNavButtonPressed

function, optional

linkshowLeadingNavButton

bool, optional

linkonDocumentLoaded

function, optional

linkdisabledElements

array of string, optional

linkdisabledTools

array of string, optional

linkcustomHeaders

object, optional

linkreadOnly

bool, optional

linkfitMode

string, optional

linklayoutMode

string, optional

linkinitialPageNumber

number, optional

linkpageNumber

number, optional

linkonPageChanged

function, optional

Perameters:

NameTypeDescription
previousPageNumberintthe previous page number
pageNumberintthe current page number
linktopToolbarEnabled

bool, optional

linkbottomToolbarEnabled

bool, optional

linkpageIndicatorEnabled

bool, optional

linkonAnnotationChanged

function, optional

Perameters:

NameTypeDescription
actionstringthe action that occurred (add, delete, modify)
annotationsarrayarray of annotation data in the format {id: string, pageNumber: int}

Example:

import { DocumentView, Config } from 'react-native-pdftron';
<DocumentView
  ref={(c) => this._viewer = c}
  document={path}
  showLeadingNavButton={true}
  leadingNavButtonIcon={Platform.OS === 'ios' ? 'ic_close_black_24px.png' : 'ic_arrow_back_white_24dp'}
  onLeadingNavButtonPressed={() => {}}
  onDocumentLoaded={() => {}}
  disabledElements={[Config.Buttons.searchButton, Config.Buttons.shareButton]}
  disabledTools={[Config.Tools.annotationCreateLine, Config.Tools.annotationCreateRectangle]}
  customHeaders={{Foo: bar}}
  initialPageNumber={11}
  readOnly={false}
  fitMode={Config.FitMode.FitPage}
  layoutMode={Config.LayoutMode.Continuous}
  onPageChanged={({previousPageNumber, pageNumber}) => { console.log('page changed'); }}
  onAnnotationChanged={({action, annotations}) => { console.log('annotations changed'); }}
/>

linkMethods

linksetToolMode

To set the current tool mode (Config.Tools constants).

this._viewer.setToolMode(Config.Tools.annotationCreateFreeHand);
linkgetPageCount

To get the current page count of the document.

Returns a Promise.

this._viewer.getPageCount().then((pageCount) => {
  console.log('pageCount', pageCount);
});
linkimportAnnotations

To import XFDF string to the current document.

Returns a Promise.

const xfdf = '<?xml version="1.0" encoding="UTF-8"?>\n<xfdf xmlns="http://ns.adobe.com/xfdf/" xml:space="preserve">...</xfdf>';
this._viewer.importAnnotations(xfdf);
linkexportAnnotations

To extract XFDF from the current document.

Perameters:

NameTypeDescription
optionsobjectkey: annotList, type: array

Returns a Promise.

this._viewer.exportAnnotations().then((xfdf) => {
  console.log('xfdf', xfdf);
});

With options:

// annotList is an array of annotation data in the format {id: string, pageNumber: int}
this._viewer.exportAnnotations({annotList: annotations}).then((xfdf) => {
  console.log('xfdf for annotations', xfdf);
});
linkflattenAnnotations

To flatten the forms and (optionally) annotations in the current document. The formsOnly parameter controls whether only forms are flattened.

Returns a Promise.

// flatten forms and annotations in the current document.
this._viewer.flattenAnnotations(false);

Get the answers you need: Support

close

Free Trial

Get unlimited trial usage of PDFTron SDK to bring accurate, reliable, and fast document processing capabilities to any application or workflow.

Select a platform to get started with your free trial.

Unlimited usage. No email address required.

Join our live demo to learn about use cases & capabilities for WebViewer

Learn more
close