Creating your first desktop Flex AIR application in Flash BuilderFor a quick, hands-on illustration of how Adobe® AIR® works, use these instructions to create and package a simple SWF file-based AIR “Hello World” application using Adobe® Flash® Builder. If you haven’t already done so, download and install Flex Builder 3 or Flash Builder 4. Also, download and install Adobe AIR, which is located here: www.adobe.com/go/air. Create an AIR projectFlash Builder includes tools to develop and package AIR applications. You begin to create AIR applications in Flash Builder or Flex Builder in the same way that you create other Flex-based application projects: by defining a new project. Note: These instructions refer to Flash Builder and use Flex 4.
(The instructions also work in Flex Builder 3.)
AIR projects initially consist of two files: the main MXML file and an application XML file (known as the application descriptor file). The latter file specifies parameters for identifying, installing, and launching AIR applications. There will be occasions when you will want to manually edit this file. For now, be aware that it exists. For more information, see Developing AIR applications with Flash Builder. Write the AIR application codeTo write the “Hello World” application code, you edit the application MXML file (AIRHelloWorld.mxml), which is open in the editor. If it isn't, use the Project Navigator to open the file. Flex AIR applications on the desktop are contained within the MXML WindowedApplication tag. The MXML WindowedApplication tag creates a simple window that includes basic window controls such as a title bar and close button.
These style settings apply to the entire application and render the window background a slightly transparent gray. The application code now looks like the following: <?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
title="Hello World">
<fx:Style>
@namespace s "library://ns.adobe.com/flex/spark";
s|WindowedApplication
{
skinClass:ClassReference("spark.skins.spark.SparkChromeWindowedApplicationSkin");
background-color:#999999;
background-alpha:"0.7";
}
</fx:Style>
<s:Label text="Hello AIR" horizontalCenter="0" verticalCenter="0"/>
</s:WindowedApplication>
Next, you will change some settings to allow the application to be transparent:
Test the AIR applicationTo test the application code that you’ve written, run it in debug mode.
Note: If the application does not compile, fix any
syntax or spelling errors that you inadvertently entered into the
code. Errors and warnings are displayed in the Problems view in
Flash Builder.
Package, sign, and run your AIR applicationYou are now ready to package the "Hello World" application into an AIR file for distribution. An AIR file is an archive file that contains the application files, which are all of the files contained in the project’s bin folder. In this simple example, those files are the SWF and application XML files. You distribute the AIR package to users who then use it to install the application. A required step in this process is to digitally sign it.
You can now run the application from the Project Navigator in Flash Builder or from the file system by double-clicking the AIR file. |
|