PDFTron is now Apryse. Same great products, new name.

Mobile Cross-Platform PDF Viewers: Options for Android, iOS, Windows Store (UWP) Apps

By Apryse | 2014 Feb 03

Sanity Image
Read time

4 min

The rise of mobile platforms, each with its own native programming language and API, has created new demand for cross-platform development tools and SDKs. To display a PDF, most cross-platform toolkits offer either a C++ interface (which do not provide a native UI component) or might be a simple PDF-to-image style solution. In this post, we will outline some better options for handling PDFs in a cross-platform manner on mobile devices.

Native SDKs: 4 Platforms, 4 Languages, 1 API

The first option is to use our native SDK that provides a Java interface on Android, an Objective-C interface on iOS and a C#/C++/CX/JavaScript interface for Windows Store Apps and Windows Phone apps. This might not immediately sound very “cross-platform”, but in a sense it is because our library has the same API on all our platforms. So, for example, here is code for creating a new PDF document, adding a page, and then displaying the page count, on three different platforms. Notice that aside from platform-specific differences, the code is identical.

Android (Java):

PDFNet.initialize();
 
PDFDoc myDoc = new PDFDoc();
PDFRect letterPageRect = new PDFRect(0, 0, 612, 792);
Page page = myDoc.pageCreate(letterPageRect);
myDoc.pagePushFront(page);
int numPages = myDoc.getPageCount();
 
System.out.println("My document has " + numPages + " pages.");

Windows Store Apps and Windows Phone (C#):

PDFNet.Initialize();
 
PDFDoc myDoc = new PDFDoc();
PDFRect letterPageRect = new PDFRect(0, 0, 612, 792);
Page page = myDoc.PageCreate(letterPageRect);
myDoc.PagePushFront(page);
int numPages = myDoc.GetPageCount();
 
System.Diagnostics.Debug.WriteLine("My document has {0} pages.", numPages);

Note that PDFNet is also compatible with C++/CX and JavaScript for Windows Store Apps.

iOS (Objective-C):

[PDFNet Initialize:@""];
 
PDFDoc* myDoc = [[PDFDoc alloc] init];
PDFRect* letterPageRect = [[PDFRect alloc] initWithX1:0 y1:0 x2:612 y2:792];
Page* page = [myDoc PageCreate:letterPageRect];
[myDoc PagePushFront:page];
int numPages = [myDoc GetPageCount];
 
NSLog(@"My document has %d pages.", numPages);

Native Cross-platform: Xamarin and Appcelerator Titanium

Of course having the same PDF API across platforms helps with the PDF processing portion of an app, but some developers want to extend the same principle to the entire app. A prominent company that helps with this is of course Xamarin (now owned by Microsoft).

Xamarin allows developers to create apps for Android and iOS using C#, and to use the same code on both platforms. To integrate native libraries such as PDFNet, Xamarin has developed a system for “wrapping” them so that they can be directly accessed via C# in a Xamarin app. Wrapping a library can be a time consuming and at times tricky process, so we have prepared a pre-wrapped version of PDFNet for Xamarin.Android and Xamarin.iOS which you can download here.

On Appcelerator Titanium, integrating with native code involves writing a “module”, for which the process is outlined on their webpage for both Android and iOS.

Hybrid Apps: PhoneGap, Cordova

PhoneGap (and its underlying technology Cordova), takes a different approach to cross-platform development by wrapping an HTML5 web app in a native container. This way the app developer writes a single HTML5 app using HTML/CSS/JavaScript which is hosted in a native web view on each target platform. These are called hybrid apps. The native portion of the app is mostly responsible for simply showing a web page which runs the actual HTML5 app. However because the web page is hosted by a native app, it can be sold in an app store just like any other app. Check out our post on how to integrate a PDF viewer into HTML5 apps.

So How Can You Add PDF Viewing to a Hybrid App?

1. Direct Native Integration

PhoneGap and Cordova provide a bridging interface so that native libraries can be integrated into these apps. With PhoneGap, you need to write a “plug-in,” with the process detailed on PhoneGap’s website for Android and iOS. Cordova has similar information in their Plugin Development Guide.

2. HTML5 WebViewer

Another approach to cross platform document viewing is to dispense with the native control and in its place use Apryse’s WebViewer, a pure-HTML5 document viewer. The WebViewer functions by using PDF documents that have been converted to a web-optimized XPS format that preserves the font and vector content found in a PDF, and then presents this document in a mobile, multi-touch friendly viewer.

Here are some pros and cons to consider when evaluating using a native control vs. the HTML5 WebViewer within a hybrid app:

  • PDFNet Native Pros: Fast; works directly on any PDF.
  • PDFNet Native Cons: Requires the inclusion of a multi-megabyte library; requires more work to integrate.
  • WebViewer Pros: Simple integration for all platforms; extremely lightweight; lower licensing cost.
  • WebViewer Cons: Does not have all of the PDF processing capabilites that are available in PDFNet; documents need to be optimized to guarantee fast viewing across devices.

We have a sample integration with Cordova on our Webviewer sample page.

Custom Hybrid Apps

Developers also have the option of writing custom hybrid apps without relying on PhoneGap/Appcelerator, etc. This may offer some additional flexibility or performance over using one of the toolkits. As when using the hybrid app toolkits, the native library (PDFNet) or the WebViewer could be used, with the same pros and cons listed above applying. The WebViewer web page has sample apps for Android, iOS, and WinRT. We will also be writing a tutorial blog post about custom hybrid apps, so stay tuned!

Pure Web Apps

Lastly we come to writing a pure web app, that is a web site that looks and acts like an app but is only accessible via the web using a standard browser. These apps can provide document viewing using the WebViewer, a pure HTML5 component that will work on all modern mobile platforms. As stated above, the WebViewer is optimized for mobile viewing, including using swipe gestures to turn pages and pinch-to-zoom.

Sanity Image

Apryse

Share this post

email
linkedIn
twitter