AIR can render PDFs using the HTMLControl as long as the host computer
has Acrobat 8 or later installed.

I have seen many examples of doing this, just without the ability to scale the PDF larger and smaller when a resize of the AIR application occurs. So I worked that issue out and wanted to share it with the Flex community.

To load a PDF into an AIR application, use the HTMLLoader class to load the PDF into your AIR window. Since you cannot add the HTMLLoader as a child, you will need to create a UIComponent() to add the PDF to a container.

If you look at the addFile() function, you will see that I first checked the PDF capability had a STATUS_OK before proceeding to the PDF loading steps with the following line of code:

if(HTMLLoader.pdfCapability == HTMLPDFCapability.STATUS_OK) {}

Once successful, I created an URLRequest to locate the PDF on my Tomcat server. You could easily add a parameter to set the PDF based on your content management as needed.

I then set the PDF’s initial height and width to that of the with the id of container. After that is done, I loaded the PDF to the HTMLLoader from the URLRequest.

Now that you have a handle on the PDF and it is loaded to the AIR application, you can use the UIComponent.addChild function to add the PDF to the UIComponent. After that, you need to add the child to the which is done by calling the addChild() function on container.

If you look at the example from the Adobe Livedocs you will notice they give the PDF’s height and width static numbers. What we want to do is allow the PDF to scale on window resize. To accomplish this, create a new function that is executed everytime the application is resized. In this example, I created the scalePDF() function that is called by the resize function on the as follows:

Since the width and height are set to 100% on the and I set the PDF’s height and width to the height and width, the PDF will resize to fit the width and height of the every time it is resized. This will always give you the maximum reading space available for the PDF.

Here is the full source for this example. You can take this code and create a component that can be reused throughout your AIR applications. Enjoy.

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication
   xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">

   <mx:Script>
      <![CDATA[
      import mx.core.UIComponent;

      private var pdf:HTMLLoader = new HTMLLoader();

      private function addFile():void
      {
         if(HTMLLoader.pdfCapability == HTMLPDFCapability.STATUS_OK)
         {
            var request:URLRequest =
               new URLRequest("http://localhost:8080/af_Central/a.pdf");

            pdf.height = container.width;
            pdf.width = container.width;

            pdf.load(request);

            var ui:UIComponent = new UIComponent();
            ui.addChild(pdf)

            container.addChild(ui);
         }
         else
         {
            trace("PDF cannot be displayed. Error code:",
               HTMLLoader.pdfCapability);
         }
      }
      private function scalePDF():void
      {
         pdf.height = container.width;
         pdf.width = container.width;
      }
      ]]>
   </mx:Script>

   <mx:Button label="Do It" click="addFile()" />
   <mx:VBox id="container" width="100%" height="100%"
      resize="scalePDF()"/>

</mx:WindowedApplication>