Friday, May 8, 2009

AlivePDF Tutorial : How to create a PDF file with Flex/AIR

Here, we are going to see how to use the alivepdf library written by Thibault Imbert. This library allows us to create pdf content with Flex. In this tutorial, we will be using Adobe AIR in order to save the file. So lets get started. First create a new Flex project and select Desktop Application as the type. Download the AlivePDF library here. Copy the swc file and paste it in the libs folder. Now in the main application file, type the following code.


<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
<![CDATA[
import org.alivepdf.pdf.PDF;
import org.alivepdf.saving.Method;
import org.alivepdf.fonts.*;
import org.alivepdf.pages.Page;
import org.alivepdf.display.Display;
import org.alivepdf.layout.*;

private var pdf:PDF;
private var file:File;
[Embed( source="/assets/o-png24.png", mimeType="application/octet-stream" )]
private var pngBytes:Class;
public function generate ():void
{
var pdf:PDF = new PDF( Orientation.PORTRAIT, Unit.MM, Size.A4 );
pdf.setDisplayMode( Display.FULL_PAGE, Layout.SINGLE_PAGE );
var newPage:Page = new Page ( Orientation.PORTRAIT, Unit.MM, Size.A4 );
pdf.addPage( newPage );
pdf.setFont(FontFamily.ARIAL , Style.NORMAL, 12);
pdf.addText("This is a sample text",5,15);
pdf.drawCircle(25,35,15);
pdf.addPage();
pdf.addImageStream( new pngBytes() as ByteArray );
var fs:FileStream = new FileStream();
file = File.desktopDirectory.resolvePath("testPage.pdf");
fs.open( file, FileMode.WRITE);
var bytes:ByteArray = pdf.save(Method.LOCAL);
fs.writeBytes(bytes);
fs.close();
}
]]>
</mx:Script>
<mx:Button click="generate()" label="Generate PDF" horizontalCenter="0" verticalCenter="0"/>
</mx:WindowedApplication>

and Run the application.

The main class here is PDF. The addPage method adds a new page. Similarly, there are a lot of options such as addImage, addText and also graphic methods such as drawCircle. drawRect,etc.You can look at the documentation for this given in the zip file.

Happy experimenting :D

13 comments:

  1. is their any way to generate PDFs on the client-side from a flex application

    ReplyDelete
  2. but how can i get the pdf from a web based program in flex this code only works for desktop application is that possible to generate PDFs on the client-side from a flex web based application

    ReplyDelete
  3. @web informer, @atishay jain, It is possible. See http://www.alivepdf.org/ for more info...

    ReplyDelete
  4. hi, I'm trying the alivepdf out and wanted to create a PDF from within Flash CS4, is it possible to create one or am I restricted to FLEX?

    ReplyDelete
  5. @Sergio Marques: You can also create PDFs in Flash CS4 - just check the Flash Example of AlivePDF release (0.1.4.5) - there you'll find a Flash CS3 Demo.. ( it has to be run on a webserver !)

    ReplyDelete
  6. I am using AlivePDF (successfully) and have a question: how can we determine if the user selected "cancel" instead of "save" in the windows save dialogue box? I am creating a log of saved PDFs and if the user selects cancel instead of save I would be creating a log entry but the PDF would not exist. Thanks for any help/direction.

    ReplyDelete
  7. I found a solution (see http://blog.flexexamples.com/2008/08/25/saving-files-locally-using-the-filereference-classs-save-method-in-flash-player-10/) where an event listener is setup (see Peter deHaan response on
    May 15, 2009 at 8:19 am

    private function showAlert():void {
    alrt = Alert.show("Do you want to upload a file",
    "Well, do you?",
    Alert.YES|Alert.NO,
    null,
    alrt_close);
    }

    private function alrt_close(evt:CloseEvent):void {
    switch (evt.detail) {
    case Alert.YES:
    fileRef = new FileReference();
    fileRef.addEventListener(Event.SELECT, fileRef_select);
    fileRef.browse();
    break;
    case Alert.NO:
    // do nothing
    break;
    }
    }

    private function fileRef_select(evt:Event):void {
    Alert.show(evt.currentTarget.name);

    ReplyDelete
  8. Hi,,
    I use AlivePDF in AIR application, but I got a problem using alivepdf in addMultiCell method to make table. How do I to make all cells in the table have the same size, where the cell will be filled with data from the database of every size are not the same? Thanks ...

    ReplyDelete
  9. How to add more than one png image in a pdf

    using addImageStream

    ReplyDelete
  10. hey pradeek der is some error

    Unable to transcode /assets/o-png24.png. Createpdf1.mxml /Createpdf1/src line 18 Flex Problem

    IN THE ABOVE CODE

    ReplyDelete
  11. This doesn't work with FLEX application !

    ReplyDelete
  12. Great blog! There is lots of good information, not only me but also everyone can understand it easily
    amusement ride insurance

    ReplyDelete