ComPDF SDK for React Native

As part of the KDAN ecosystem, ComPDF SDK for React Native helps developers add advanced PDF viewing, annotation, editing, and signing features to React Native applications on Android and iOS.

It offers a native-backed React Native integration so teams can deliver mobile PDF workflows without building document tooling from scratch.

If you find ComPDF SDK useful, please consider giving us a ⭐ Star on GitHub — it helps us grow and improve! Got questions or ideas? Join the conversation in our Discussions.

Why ComPDF SDK for React Native?

• Easy to Integrate: Integrate PDF functionalities easily with our powerful SDK and clear documentation and guides with few lines of code.

• Fully Customizable UI: Design a unique interface for your products with fully customizable UI source code by a high-performing SDK.

• Comprehensive PDF Features: Supports generation, viewing, annotation, page editing, content editing, conversion, OCR, redaction, signing, forms, parsing, measurement, compression, comparison, color separation, batch processing, and more.

• Faster Time-to-Market: Comprehensive SDK libraries save your time and expenses and roll out your applications and projects.

• High-quality Service: We provide 24/7 professional one-to-one technical support, including onsite service and remote assistance via phone and email.

Table of Contents

• Supported Features
• Requirements
• Build a React Native PDF Viewer
• Apply the License Key
• Usage Example
• Configuration
• API
• Free Trial and License
• Support
• Changelog
• Related

Supported Features

Viewer: Fast and smooth PDF rendering and viewing

• Display Modes - single/double page, vertical & horizontal scrolling, cover mode, crop mode
• Text Search & Selection
• PDF Navigation - outlines, bookmarks

Annotations:

• Notes - add longer comments with adjustable icon shape and color

• Ink - freehand drawing with customizable color, opacity, line thickness

• Text - add, move, resize text directly on page

• Inspector - adjust annotation looks (line styles, borders, colors, opacity, font)

• Comment on Annotations and Update Status

• Import & Export & Flatten Annotations (XFDF, FDF, JSON)

• Highlight, Underline, Strikeout, Squiggly

• Shapes - Rectangle, Oval, Line, Arrow, Polygon, Polyline, Cloud

• Stamps, Sound, Movie, File Attachment, Link, Distance, Perimeter, Area

Forms:

• Process fillable and static PDF forms

• Form filling, form creation, form flattening

Document Editor:

• Page manipulation - insert, delete, rotate, reorder, extract, crop

• Split PDF, Merge PDF

Content Editor: Edit PDF text and images directly like in Word

Security:

• Encryption - set open password, permission password

• Restrict printing, copying, editing

Signatures:

• Electronic Signatures - draw, type, image signatures

• Digital Signatures - certificate-based signature validation

Watermark:

• Add Text or Image Watermarks

• Delete Watermarks

• Customize Watermarks

OCR:

• AI OCR

• Recognize Tables, Graphics, Images

• Support recognition in 80+ Languages

Compare Documents: Side-by-side document comparison to highlight differences

Redaction: Permanently remove sensitive content from PDFs

Measurement: Distance, area, perimeter measurement tools

Compress: Optimize and reduce PDF file size

Convert Files:

• Convert PDF to Word, Excel, PPT, HTML, CSV, images (PNG,JPEG, JPEG, JPEG2000, BMP, TIFF, TGA, GIF), RTF, TXT, JSON, XML, markdown, searchable PDF, searchable OFD.

• Convert images (PNG,JPEG, JPEG, JPEG2000, BMP, TIFF, TGA, GIF) to Word, Excel, PPT, HTML, CSV, RTF, TXT, JSON, XML.

• Convert Word, Excel, PPT, HTML, CSV, PNG, RTF, TXT to PDF

UI Customization:

• Toolbar Customization

• UI Personalization

• Ready-Made UI Options

• Out-of-the-box Source Code

Requirements

Before starting the integration, please ensure the following prerequisites are met:

Get ComPDF License Key

ComPDF offers a 30-day free trial license for testing your project. Get one online without contacting sales.

If you require advanced PDF features beyond the free trial license, please contact us to obtain a commercial license.

Download the PDF SDK

Download the ComPDF ReactNative PDF SDK from Github or NPM.

System Requirements

Android

Please install the following required packages:

• A development environment for running React Native projects using the React Native CLI (not the Expo CLI)
• The latest stable version of Android Studio
• The Android NDK (version 21 or higher)
• An Android Virtual Device or a hardware device

Operating Environment Requirements:

• Android minSdkVersion of 21 or higher.
• ComPDF SDK 2.0.1 or higher.

iOS

Please install the following required packages:

• A development environment for running React Native projects using the React Native CLI (not the Expo CLI)
• The latest stable version of Xcode
• The latest stable version of CocoaPods. Follow the CocoaPods installation guide to install it.

Operating Environment Requirements:

• ComPDF SDK 2.0.1 or higher.
• React Native dependency to version 3.0.0 or higher.
• iOS 12.0 or higher.

Build a React Native PDF Viewer

Creating a New Project

Let's create a simple app that integrates ComPDF for React Native.

1. In the terminal app, change the current working directory to the location you wish to save your project. In this example, we’ll use the ~/Documents/ directory:

bash cd ~/Documents

1. Create the React Native project by running the following command:

bash react-native init MyApp

1. In the terminal app, change the location of the current working directory inside the newly created project:

bash cd MyApp

Expo

If you’re using Expo, ComPDF requires a development build or EAS Build, so it won’t run inside Expo Go.

Add the official plugin to your Expo config:

{
  "expo": {
    "plugins": ["@compdfkit_pdf_sdk/react_native"]
  }
}

Use this plugin-driven flow for Expo and EAS Build instead of manually editing ios/Podfile. For the full setup, check out how to use ComPDF React Native SDK with Expo.

Installing-the-ComPDF-Dependency

You can integrate the SDK in two ways:

• Through ComPDF GitHub repo: In MyApp folder, install @compdfkit_pdf_sdk/react_native by calling:

shell yarn add github:ComPDFKit/compdfkit-pdf-sdk-react-native

• Through ComPDF npm package: In MyApp folder, install run the following commands:

yarn add @compdfkit_pdf_sdk/react_native

Android

1. open android/app/src/main/AndroidManifest.xml , add Internet Permission and Storage Permission：

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.compdfkit.flutter.example">

+    <uses-permission android:name="android.permission.INTERNET"/>


+    <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
+    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>


+    <uses-permission android:name="android.permission.MANAGE_EXTERNAL_STORAGE" />

    <application
+    android:requestLegacyExternalStorage="true"
        ...>
    ...
    </application>
</manifest>

1. Copy the sample pdf file to the assets directory

1. Replace App.js (or App.tsx) with what is shown for Usage-Example
2. Finally in the root project directory, run react-native run-android.

iOS

These Podfile steps are for React Native CLI projects. If you’re using Expo, declare @compdfkit_pdf_sdk/react_native in app.json and let expo prebuild or EAS Build inject the ComPDF pods for you.

1. Open your project’s Podfile in a text editor:

open ios/Podfile

1. Add the following line to the target 'MyApp' do ... end block:

target 'MyApp' do
    # ...
+  pod "ComPDFKit", podspec:'https://file.compdf.com/cocoapods/ios/compdfkit_pdf_sdk/2.6.6/ComPDFKit.podspec'
+  pod "ComPDFKit_Tools", podspec:'https://file.compdf.com/cocoapods/ios/compdfkit_pdf_sdk/2.6.6/ComPDFKit_Tools.podspec'
    # ...
end

Note: If SSL network requests fail to download the ComPDFKit library when you run pod install, you can use the following method instead.

target 'MyApp' do
    # ...
+  pod 'ComPDFKit', :git => 'https://github.com/ComPDFKit/compdfkit-pdf-sdk-ios-swift.git', :tag => '2.6.6'
+  pod 'ComPDFKit_Tools', :git => 'https://github.com/ComPDFKit/compdfkit-pdf-sdk-ios-swift.git', :tag => '2.6.6'
    # ...
end

1. In the ios folder, run pod install.

2. Open your project’s Workspace in Xcode:

bash open ios/MyApp.xcworkspace

Make sure the deployment target is set to 12.0 or higher:

1. Add the PDF document you want to display to your application by dragging it into your project. On the dialog that’s displayed, select Finish to accept the default integration options. You can use "PDF_Document.pdf" as an example.

<key>NSCameraUsageDescription</key>
<string>Your consent is required before you could access the function.</string>

<key>NSMicrophoneUsageDescription</key>
<string>Your consent is required before you could access the function.</string>

<key>NSPhotoLibraryAddUsageDescription</key>
<string>Your consent is required before you could access the function.</string>

<key>NSPhotoLibraryUsageDescription</key>
<string>Your consent is required before you could access the function.</string>

<key>NSAppTransportSecurity</key>
<dict>
<key>NSAllowsArbitraryLoads</key>
<true/>
</dict>

1. Replace App.js (or App.tsx) with what is shown for Usage-Example
2. Finally in the root project directory, run react-native run-ios.

Apply the License Key

If you haven't get a license key, please check out how to obtain a license key.

ComPDF SDK currently supports two authentication methods to verify license keys: online authentication and offline authentication.

Learn about:

What is the authentication mechanism of ComPDF?

What are the differences between Online Authentication and Offline Authentication?

Accurately obtaining the license key is crucial for the application of the license.

Android

1. In the email you received, locate the XML file containing the license key.
2. Copy the license_key_rn.xml file into the following directory:android/app/src/main/assets/

1. Initialize the SDK:

ComPDFKit.initWithPath('assets://license_key_rn.xml');

iOS

1. Use Xcode to copy the license_key_rn.xmlfile into your project’s ios/directory.

1. Initialize the SDK:

// Copy the license_key_rn_ios.xml file into your iOS project directory (or a readable location):
ComPDFKit.initWithPath('license_key_rn.xml');

Alternative Method

You can also store the License file in the device’s local storage and initialize the SDK using its file path:

```tsx // Obtain the License file through the local storage path of the device for initialization ComPDFKit.i