Import and export annotations from XFDF files on React Native

XFDF is an XML-based standard from Adobe XFDF (ISO 19444-1:2016) for encoding annotations and form field values. An XFDF file will contain a snapshot of a PDF document’s annotations and form field values. It doesn’t include the form elements or the form fields themselves — only the filled values. It’s compatible with Adobe Acrobat and several other third-party frameworks.

Information

XFDF has various limitations. In most cases, using PSPDFKit Instant will result in a smaller file and better synchronization.

PSPDFKit for React Native supports both reading and writing XFDF.

Importing XFDF

You can import annotations and form field values from an XFDF file to a document like so:

// Reference the XFDF file from the application's documents directory.
const xfdfImport =
	Platform.OS === 'ios'
		? RNFS.DocumentDirectoryPath + '/' + 'import.xfdf'
		: 'file://' + RNFS.DocumentDirectoryPath + '/' + 'import.xfdf';

const result = await this.pdfRef.current
	?.getDocument()
	.importXFDF(xfdfImport);

Exporting to XFDF

You can export annotations and form field values from a document to an XFDF file like so:

// Get a temporary location on the file system with write access to store the exported file.
const xfdfOutput = RNFS.TemporaryDirectoryPath + '/test.xfdf';

const result = await this.pdfRef.current
	?.getDocument()
	.exportXFDF(xfdfOutput);

Refer to the XFDF.tsx example in the Catalog example project for a runnable example.

Exporting annotations to XFDF via Adobe Acrobat

Adobe Acrobat can export annotations into XFDF. The export menu is part of the Comment tool and is accessed by opening the tool in the sidebar.

You can access the export function by clicking the three dots and choosing Export All To Data File….

  1. At the bottom of the page, choose Acrobat XFDF Files.

  2. Select the directory you wish to save the XFDF file to and name the file.

  3. Click Save.

A successful export will result in a file with an .xfdf extension.

Importing annotations to XFDF via Adobe Acrobat

The export function is part of the Comment tool and is accessed by clicking its icon.

Click the three dots to open the import menu, and then click Import Data File….

Highlight the XFDF file you wish to import and click Select.

The import function completes with the annotations being placed on the document.

Adobe Acrobat error conditions

Error Description Screenshot
Damaged/missing document body
Damaged/missing description tag
Missing document flag