App Inventor Extensions: Pdf

Pdf Extension

See the App Inventor Extensions document about how to use an App Inventor Extension.

For questions about this extension or bug reports please start a new thread in the App Inventor community. Thank you.

For feature requests please contact me by email. To be a sponsor of a new method already is possible starting from only 10 USD! With your contribution you will help the complete App Inventor community. Thank you.

Nov 14th, 2016: Initial Version 1

Nov 19th, 2016: Version 1a: bug fixes

Oct 25th, 2017: Version 1b-e: new properties render mode, quailty, rendered filename added

Mar 5th, 2018: Version 2: new property hasAlpha added, see also this discussion

Mar 24th, 2021: Version 2a: Android Min SDK set to 21, rendered file will now be stored in the ASD, no WRITE_EXTERNAL_STORAGE permission required anymore, Android 10 update concerning asset path for companion app, Android 11 update concerning READ_EXTERNAL_STORAGE for SDK29

Description

Extension to open pdf files and render a specific page (without using an external app).

Required permissions: android.permission.READ_EXTERNAL_STORAGE
Minimum API level of this extension is 21 (Android 5)!

Properties

Returns whether Warnings should be suppressed

Specifies whether Warnings should be suppressed

Returns the number of pages

Set the quality in dpi to render the pdf page. Default is 72 dpi.

Set render mode (DISPLAY or PRINT). Default is DISPLAY.

Has alpha (true or false), i.e. if the pixels may contain non-opaque alpha values. Default is false.
Setting this property to true will convert a transparent background into white.

Methods

Open a pdf file.
Prefix the pdfFilename with / (i.e. relative path) to open a pdf file from the SD card. For instance /myFile.pdf will open the file /storage/emulated/0/myFile.pdf. To open a pdf file from the assets packaged with an application (also works for the Companion) start the pdfFileName with // (two slashes). If a pdfFileName starts with file:/// you can specify a complete path to the pdf file.

Note 1: spaces in the pdf file name are not allowed!
Note 2: to open a pdf file from the assets is currently an experimental feature, see the Known Issues.

Render a specific page.

Events

Event indicating that pdf file was opened.
If the pdf file was opened successfully, the flag 'successful' is true and the pdfFileName is provided in the response. In case of an error, flag 'successful' is false and the error message is provided in the response.

Example Use

The example offers the possibility to pick a pdf file from the assets, renders a specific page and displays it in the webviewer to be able to zoom in/zoom out. In case you don't need zoom functionality, use an image component instead of the webviewer.

You have to ask for READ_EXTERNAL_STORAGE permission only if you like to open a file from the emulated sdcard (you do not need it for a file from the assets or the ASD - application specific directory).

The example app uses a html file (see chapter HTML/Javascript below) stored in the assets of the app to display the rendered page of the pdf file. If you also want to use the webviewer to display the pdf, then please do not forget to upload that html file as media file into the assets of your app!

HTML/JavaScript

<!doctype html>
<head>
  <meta name="author" content="puravidaapps.com">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Page</title>
</head>

<body>
  <div id="myDiv">
    <p><img id = "myImage" src="" alt="" title=""></p>
  </div>

  <script>
    // get the iamge file name from the window.AppInventor object and display it
    var image = window.AppInventor.getWebViewString();
    document.getElementById("myImage").src = image;
  </script>

</body>
</html>

Test

Version 2a tested successfully on Samsung Galaxy A51 running Android 11.

Known Issues

It has been reported, that opening a pdf file from the assets on a Lollipop device (Android 5) results in a runtime error. Unfortunately I do not have an Android 5 device, so I'm unable to test on such device. In case you have an Android 5 device and you like to help me to fix this issue, then please contact me by email. Thank you.

As workaround just use the Copy block from the File extension to copy the file first to the sdcard and view it from there.

For questions about App Inventor,
please ask in the App Inventor community.Thank you.

Questions and Answers

Q1: Does this extension work if I provide the full path of the location of the PFD file? For instance, this path: /storage/emulated/0/Download/filename.pdf? Why? Because I want to use your extension with the FileChooser Extension by ILoveThunkable. And the file chooser extension only provides the full path.
A: See the documentation: "If a pdfFileName starts with file:/// you can specify a complete path to the pdf file." Example: file:///storage/emulated/0/Download/filename.pdf, so just use the join block and join file:// together with the filename you receive from that extenion.

Q2: Does PDF reader swipe to go to next page feature there?
A: No, because the purpose of the pdf etension is to open pdf files and to render a specific page. To display the rendered page you can use an image component or a webviewer. There might be a webviewer extension available, which offers a swipe event... you might want to ask in the forum...

Q3: In my own app I get the error message "webpage not available" while displaying the pdf file usng the webviewer. The example project works fine. What is the problem?
A: The example app uses a html file stored in the assets of the app to display the rendered page of the pdf file. If you also want to use the webviewer to display the pdf, then please do not forget to upload that html file as media file into the assets of your app!

Q4: Just I noticed from the demo apk of PDF ext that when I open the PDF it is zoomed and I need to zoom out. How I can set it by default to no zoom when the PDF is opened?
A: You can use some JavaScript to set the zoom factor, just modify the html file page.html in the assets accordingly.

Q5: I can not do a simple test for what I want to do. Can you give me a simple example with: when I click on the button1, display a PDF?
A: Here are the blocks for a simple example to open a one page pdf file and render that page. In case you don't need the feature to zoom the pdf, you alternatively can use an image component instead of the webviewer. Please do the tutorials to learn the basics!

Here a simple example to display the pdf file in an image component:

Test the functionality of the Pdf extension

The test app is available in Google Play. You can test the example following these steps

Follow the opt-in URL to get access to the app and to be able to download it to your device. It might take a few hours for Google to enable you as beta tester!
Start testing.

Note: Minimum API level of this extension is 21 (Android 5)!

App Inventor Extensions

Pdf Extension

Description

Properties

Methods

Events

Example Use

HTML/JavaScript

Test

Known Issues

For questions about App Inventor,
please ask in the App Inventor community.Thank you.

Questions and Answers

Test the functionality of the Pdf extension

Buy the Pdf extension for App Inventor

Terms and Conditions

App Inventor Extensions

Pdf Extension

Description

Properties

Methods

Events

Example Use

HTML/JavaScript

Test

Known Issues

For questions about App Inventor,please ask in the App Inventor community.Thank you.

Questions and Answers

Test the functionality of the Pdf extension

Buy the Pdf extension for App Inventor

Terms and Conditions

For questions about App Inventor,
please ask in the App Inventor community.Thank you.