App Inventor and the Web component


How to create a pdf file

To find a solution for this problem, I first looked at this JavaScript solution, but couldn't get it to work together with App Inventor. Then I went through these APIs and prepared the solution presented below together with the ConvertAPI.

Note: ConvertAPI now changed its policy, which means, you now need an API key to be able to create a pdf file.

Preparation

For your own app, you first have to register here to get your own ApiKey. This enables you to print 500 pdf files for free. See also here how to buy more credits.

Some basic HTML

A simple HTML document is used to generate the pdf file.

<div>
  <h1><img src="http://puravidaapps.com/images/logo.png" width="48" height="48" alt="" title=""> Pura Vida Apps</h1>
  <h2>Invoice</h2>
  <p>
    Donald Duck<br>
    1113 Quack Street<br>
    Duckburg, Calisota, USA  
  </p>
  <h3>
    Thank you for being interested in the <span style="color:green"><b>create PDF</b></span> example.<br>
   <span style="color:red">You can buy the source code for 
    <img src="http://ai2.appinventor.mit.edu/images/logo.png" width="22" height="20" alt="" title=""> App Inventor!</span><br>
    For details see here: <span style="color:blue">http://puravidaapps.com/createPDF.php</span>
  </h3>
  <h2>Woo Hoo!</h2>
</div>

Are you currently not familiar with HTML/CSS/JavaScript?

App Inventor Blocks


Do you need help with your App Inventor project?

I can help you: for one hour I charge 25 USD.
Please contact me at info [at] puravidaapps [dot] com for details!
For questions about App Inventor, please use the App Inventor forum. Thank you.

Screenshots

Questions and Answers

Q1: When you create a a pdf with your procedure, can you add pictures in it?
A: Yes, the pictures have to be available in the internet. It will not work for images stored as assets in your app or images only available on the sd card of your device. Just upload the images to the internet before creating the pdf, see also How to use the PostFile block in App Inventor. As you can see, in the example I used my logo to be displayed in the pdf file...

Q2: When the pdf has been created, can you view it by a pc or it is possible only with root?
A: The created pdf file will be stored on the sd card of your device. You can send it via email to yourself and view it by a pc and by any pdf reader which is installed on your device..

Q3: Can I rename the files and can I make two files without deleting the first?
A: Yes you can, just use the Web.ResponseFileName property to define the name of the pdf to be downloaded.

Q4: Do I need to purchase credits from "ConvertApi"?
A: Note: ConvertAPI changed its policy, which means, after creating the 500 free pdf, you will have to buy credits to be able to create more pdfs using the same ApiKey.

Test

Tested successfully on Nexus 5 running Android 4.4.4.

Download

You can test this functionality with the apk file, which is available for download here: Download createPDF apk file.

Buy the source code for App Inventor


You can buy the source code of this project.
With your payment you accept the terms and conditions below.

Payment options

1. Paypal

Please transfer 10 USD via Paypal
to Pura Vida Apps

2. Bitcoin

After having received your payment I will be happy to send the source code to you.
Thank you! Taifun


Please check your spam folder in case you did not receive the example!
I usually will send the project not later than 24 hours after having received your payment.

 

Terms and Conditions

Back to top of page ...


Home | Snippets | Tutorials | Extensions | News | Forums | Links | Search | Contact

'