Nutrient Flutter SDK is for viewing, annotating, and editing PDFs. It offers developers the ability to quickly add PDF functionality to any Flutter application. It is available at pub.dev and GitHub.
If you are new to Flutter, make sure to check our Flutter blog posts:
- Getting Started with Flutter PDF Library by Nutrient.
- Opening a PDF in Flutter.
- How to Customize Our Flutter PDF SDK.
- Advances in Hybrid Technologies.
- How We Maintain Our Public Flutter Project Using a Private Monorepo.
- How to Download and Display a PDF Document in Flutter with Nutrient.
For our quick-start guides, check out our website.
Platform specific README exists for Android and iOS.
-
Open
pubspec.yaml
:open pubspec.yaml
-
Add the PSPDFKit dependency in
pubspec.yaml
:dependencies: flutter: sdk: flutter + pspdfkit_flutter: any
-
Open
lib/main.dart
and replace the entire content with the contents of demo_project_main.dart.txt. This simple example will load a PDF document from local device filesystem. -
Add the PDF document you want to display in your project’s
assets
directory.-
First create a
PDFs
directory:mkdir PDFs
-
Move a sample document into the newly created
PDFs
directory, and rename it asDocument.pdf
:cp ~/Downloads/PSPDFKit.pdf PDFs/Document.pdf
-
-
Specify the
assets
directory inpubspec.yaml
:# The following section is specific to Flutter. flutter: + assets: + - PDFs/ ...
-
From the terminal app, run the following command to get all the packages:
flutter pub get
- The [latest stable version of Flutter][install-flutter]
- The [latest stable version of Android Studio][android studio]
- The [Android NDK][install ndk]
- An [Android Virtual Device][managing avds] or a hardware device
-
Create a Flutter project called
pspdfkit_demo
with theflutter
CLI:flutter create --org com.example.pspdfkit_demo pspdfkit_demo
-
In the terminal app, change the location of the current working directory to your project:
cd pspdfkit_demo
-
Update the
pluginManagement
block in theandroid/settings.gradle
file as follows:pluginManagement { ... + buildscript { + repositories { + mavenCentral() + maven { + url = uri("https://storage.googleapis.com/r8-releases/raw") + } + } + dependencies { + classpath("com.android.tools:r8:8.3.37") + } + } } // Upgrade Kotlin version. plugins { id "dev.flutter.flutter-plugin-loader" version "1.0.0" id "com.android.application" version "7.3.0" apply false - id "org.jetbrains.kotlin.android" version "1.7.10" apply false + id "org.jetbrains.kotlin.android" version "1.8.22" apply false }
This step involves enabling R8 for code shrinking (not required for AGP 8.* and above) and upgrading the Kotlin version.
-
Open the app’s Gradle build file,
android/app/build.gradle
:open android/app/build.gradle
-
Modify the compile SDK version and the minimum SDK version:
android { - compileSdkVersion flutter.compileSdkVersion + compileSdkVersion 34 ... defaultConfig { - minSdkVersion flutter.minSdkVersion + minSdkVersion 21 ... } compileOptions { - sourceCompatibility JavaVersion.VERSION_1_8 - targetCompatibility JavaVersion.VERSION_1_8 + sourceCompatibility JavaVersion.VERSION_17 + targetCompatibility JavaVersion.VERSION_17 } // If you have this block, update the `jvmTarget` to 17. kotlinOptions { - jvmTarget = '1.8' + jvmTarget = '17' } ... }
-
Add the AppCompat AndroidX library to your
android/app/build.gradle
file:dependencies { implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:$kotlin_version" + implementation 'androidx.appcompat:appcompat:1.4.0' }
-
Open the project’s main activity class,
android/app/src/main/kotlin/com/example/pspdfkit_demo/pspdfkit_demo/MainActivity.kt
:open android/app/src/main/kotlin/com/example/pspdfkit_demo/pspdfkit_demo/MainActivity.kt
-
Change the base
Activity
to extendFlutterAppCompatActivity
:- import io.flutter.embedding.android.FlutterActivity; + import io.flutter.embedding.android.FlutterAppCompatActivity; - public class MainActivity extends FlutterActivity { + public class MainActivity extends FlutterAppCompatActivity { }
Alternatively you can update the
AndroidManifest.xml
file to useFlutterAppCompatActivity
as the launcher activity:<activity - android:name=".MainActivity" + android:name="io.flutter.embedding.android.FlutterAppCompatActivity" android:launchMode="singleTop" android:theme="@style/LaunchTheme" android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode" android:hardwareAccelerated="true" android:windowSoftInputMode="adjustResize" android:exported="true">
NOTE:
FlutterAppCompatActivity
isn’t an official part of the Flutter SDK. It’s a customActivity
that extendsAppCompatActivity
from the AndroidX AppCompat library, and it’s necessary to use PSPDFKit for Android with Flutter. You can read more about this in the [AppCompatActivity Migration][] guide. -
Update the theme in
android/app/src/main/res/values/styles.xml
to usePSPDFKit.Theme.default
as the parent:- <style name="NormalTheme" parent="Theme.AppCompat.Light.NoActionBar"> + <style name="NormalTheme" parent="PSPDFKit.Theme.Default">
This is to customize the theme of the PSPDFKit UI. You can read more about this in the [appearance styling][] guide.
-
[Start your Android emulator][start-the-emulator], or connect a device.
-
Run the app with:
flutter run
- The [latest stable version of Flutter][install-flutter]
- The [latest stable version of Xcode][xcode]
- The [latest stable version of CocoaPods][cocoapods releases]
-
Create a Flutter project called
pspdfkit_demo
with theflutter
CLI:flutter create --org com.example.pspdfkit_demo pspdfkit_demo
-
In the terminal app, change the location of the current working directory to your project:
cd pspdfkit_demo
-
Open
Runner.xcworkspace
from theios
folder in Xcode:open ios/Runner.xcworkspace
-
Make sure the
iOS Deployment Target
is set to 15.0 or higher. -
Change "View controller-based status bar appearance" to YES in
Info.plist
. -
Open your project’s Podfile in a text editor:
open ios/Podfile
-
Update the platform to iOS 15 and add the PSPDFKit Podspec:
-# platform :ios, '9.0' + platform :ios, '15.0' ... target 'Runner' do use_frameworks! use_modular_headers!` flutter_install_all_ios_pods File.dirname(File.realpath(__FILE__)) + pod 'PSPDFKit', podspec:'https://customers.pspdfkit.com/pspdfkit-ios/latest.podspec' end
-
Run
flutter emulators --launch apple_ios_simulator
to launch the iOS Simulator. -
Run the app with:
flutter run
- The [latest stable version of Chrome][chrome]
PSPDFKit for Web library files are distributed as an archive that can be extracted manually.
-
Download the framework here. The download will start immediately and will save a
.tar.gz
archive likePSPDFKit-Web-binary-<%= latest_version(:web) %>.tar.gz
to your computer. -
Once the download is complete, extract the archive and copy the entire contents of its
dist
folder to your project’sweb/assets
folder or any other folder of your choice inside the web subfolder. -
Make sure your
assets
folder contains thepspdfkit.js
file and apspdfkit-lib
directory with the library assets. -
Make sure your server has the
Content-Type: application/wasm
MIME typeset. Read more about this in the Troubleshooting section. -
Include the PSPDFKit library in your
index.html
file:
<script src="assets/pspdfkit.js"></script>
-
Run the app with:
flutter run
To see PSPDFKit for Flutter in action check out our Flutter example app.
Showing a PDF document inside your Flutter app is as simple as this:
PspdfkitWidget(documentPath: 'file:///path/to/Documentpdf')
Nutrient is a commercial product and requires the purchase of a license key when used in production. By default, this library will initialize in demo mode, placing a watermark on each PDF and limiting usage to 60 minutes.
To purchase a license for production use, please reach out to us via contact_sales.
To initialize Nutrient using a license key, call either of the following before using any other Nutrient APIs or features:
To set the license key for both Android and iOS, use:
await Pspdfkit.initialize(
androidLicenseKey:"YOUR_FLUTTER_ANDROID_LICENSE_KEY_GOES_HERE",
iosLicenseKey:"YOUR_FLUTTER_IOS_LICENSE_KEY_GOES_HERE",
webLicenseKey: "YOUR_FLUTTER_WEB_LICENSE_KEY_GOES_HERE"
);
To upgrade Nutrient for Flutter in your app, please refer to the Upgrade and Migration Guides section.
For Troubleshooting common issues you might encounter when setting up Nutrient for Flutter, please refer to the Troubleshooting section.