Generating PDF documents from Flex

A few weeks ago we released a fantastic addition to our family of products - WebORB PDF Generator. I have not had a chance to describe the product in this blog, so consider this an introduction. This post will focus primarily on Flex, though the product supports all major rich client types including Silverlight, Flash and AJAX. 

Creating a PDF document from Flex using WebORB PDF Generator could not be simpler. The product generates documents using templates. In case of Flex, a template can be created using Flex Builder. Simply create an MXML component (you can use Canvas as the parent class). Lay out basic components to create a template. To generate a PDF document document from the template, create an instance of the MXML component and call the PDF Generator service using our API. Here's an example of a very basic template:

<?xml version="1.0" encoding="utf-8"?>

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="300">

  <mx:Label text="DataGird with server-side data:" x="10" y="10"/>

  <mx:DataGrid id="customersGrid" left="10" right="10" fontSize="10"

      bottom="10" top="30"

      dataProvider="{'method:Weborb.Examples.DataBinding.getCustomers()'}" > 

      <mx:columns>

          <mx:DataGridColumn dataField="COMPANYNAME" headerText="Company" />

          <mx:DataGridColumn dataField="CONTACTNAME" headerText="Name"/>

          <mx:DataGridColumn dataField="PHONE" headerText="Phone Number" />

      </mx:columns>

  </mx:DataGrid>    

</mx:Canvas>

The template uses the DataGrid component to render a table in PDF document created from it. Notice the dataProvider attribute of the DataGrid component:

dataProvider="{'method:Weborb.Examples.DataBinding.getCustomers()'}"


The dataProvider references a method which will be invoked by the PDF Generator service and the returned data will go into the PDF document.

Suppose the MXML component's name is MyTemplate.mxml. To create a PDF document using that template from Flex, use the following code:

var pdfGenerator:PDFGenerator = new PDFGenerator( this );

var template:MyTemplate = new MyTemplate();

pdfGenerator.generatePDF( template );

PDF Generator creates a document and returns the document URL to the Flex client. The default implementation opens the URL in a new window. This behavior can be overridden with a responder object:

var myResponder:PDFResponder = new PDFResponder( gotURL, gotError );

pdfGenerator.generatePDF( template, myResponder );


See the PDF document created for the template shown above.

You can use the following Flex components to create templates:

• DataGrid - will be used to display tabular data
• List - displays linear (single column) lists
• HRule, VRule - display vertical or horizontal lines (you can select widht, height, color, etc)
  
• TextInput, TextArea - can be used to create PDF Forms in your PDF document
• Image - will render a bitmap image in the document
• any charting component - will render chart in the PDF
• our own FlashContent component - will render Flash content in the resulting PDF document
• TabNavigator or Accordion - to create PDF documents with different layouts for each page

We have put together an example demonstrating all the supported Flex components in various sample templates.

See full PDF Generaotr documentation for Flex clients. Product page is available at the following URL: http://www.themidnightcoders.com/products/pdf-generator/overview.html