Requirements
Install the following required packages:
-
The Android NDK
-
An Android Virtual Device or a hardware device
-
The latest stable version of CocoaPods. If you don’t already have CocoaPods installed, follow the CocoaPods installation guide to install CocoaPods on your Mac.
Creating a New Project
-
Create a Flutter project called
pspdfkit_demo
with theflutter
CLI:
flutter create --org com.example.pspdfkit_demo pspdfkit_demo
Installing the PSPDFKit Dependency
-
In the terminal app, change the location of the current working directory to your project:
cd <project-root>
-
Open the project’s Gradle build file,
android/build.gradle
:
open android/build.gradle
-
Modify the Kotlin version inside the
buildscript
section:
buildscript { - ext.kotlin_version = '1.3.50' + ext.kotlin_version = '1.8.10' repositories { google() mavenCentral() } ... }
-
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 33 ... defaultConfig { - minSdkVersion flutter.minSdkVersion + minSdkVersion 21 ... } }
-
Change the base
Activity
to extendFlutterFragmentActivity
:
- import io.flutter.embedding.android.FlutterActivity; + import io.flutter.embedding.android.FlutterFragmentActivity; - public class MainActivity extends FlutterActivity { + public class MainActivity extends FlutterFragmentActivity { }
-
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.
-
For PSPDFKit iOS SDK version 12.1.0 and above, it’s necessary to set the license key in the
AppDelegate
object before initializing PSPDFKit for the first time. If you’re using a trial version, set it as an empty string:
#import <PSPDFKit/PSPDFKit.h> @implementation AppDelegate - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { [PSPDFKitGlobal setLicenseKey:@"YOUR_LICENSE_KEY" options:@{PSPDFSettingKeyHybridEnvironment: @"Flutter"}]; ... // Override point for customization after application launch. return [super application:application didFinishLaunchingWithOptions:launchOptions]; } ...
-
Open
pubspec.yaml
:
open pubspec.yaml
-
Add the PSPDFKit dependency in
pubspec.yaml
:
dependencies:
flutter:
sdk: flutter
+ pspdfkit_flutter:
-
From the terminal app, run the following command to get all the packages:
flutter pub get
-
Then run the command below to upgrade the dependencies:
flutter pub upgrade
-
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' ... flutter_install_all_ios_pods File.dirname(File.realpath(__FILE__)) + pod 'PSPDFKit', podspec:'https://my.pspdfkit.com/pspdfkit-ios/latest.podspec' + pod 'Instant', podspec: 'https://my.pspdfkit.com/instant/latest.podspec'
Displaying a PDF
-
Open the
lib/main.dart
file:
open lib/main.dart
-
Replace the contents of
lib/main.dart
with the following code snippet that loads a document from theassets
path:
import 'dart:io'; import 'package:flutter/material.dart'; import 'package:pspdfkit_flutter/pspdfkit.dart'; const String DOCUMENT_PATH = 'PDFs/Document.pdf'; void main() => runApp(MyApp()); class MyApp extends StatefulWidget { @override _MyAppState createState() => _MyAppState(); } class _MyAppState extends State<MyApp> { void showDocument(BuildContext context) async { final bytes = await DefaultAssetBundle.of(context).load(DOCUMENT_PATH); final list = bytes.buffer.asUint8List(); final tempDir = await Pspdfkit.getTemporaryDirectory(); final tempDocumentPath = '${tempDir.path}/$DOCUMENT_PATH'; final file = await File(tempDocumentPath).create(recursive: true); file.writeAsBytesSync(list); await Pspdfkit.present(tempDocumentPath); } @override Widget build(BuildContext context) { final themeData = Theme.of(context); return MaterialApp( home: Scaffold( body: Builder( builder: (BuildContext context) { return Center( child: Column( mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: [ ElevatedButton( child: Text('Tap to Open Document', style: themeData.textTheme.headline4?.copyWith(fontSize: 21.0)), onPressed: () => showDocument(context)) ])); }, )), ); } }
-
Add the PDF document you want to display in your project’s
assets
directory. You can use this Quickstart Guide PDF as an example. -
Create a
PDFs
directory:
mkdir PDFs
-
Copy the sample document into the newly created
PDFs
directory:
cp ~/Downloads/Document.pdf PDFs/Document.pdf
-
Specify the
assets
directory inpubspec.yaml
:
# The following section is specific to Flutter.
flutter:
+ assets:
+ - PDFs/
...
-
Start your Android emulator or iOS simulator, or connect a device.
-
Run the app with:
flutter run
Next Steps
To learn more about Flutter, make sure to check out the following blog posts: