Download the Adobe AIR Extension for Dreamweaver here: http://www.adobe.com/products/air/tools/ajax/.
The Adobe® AIR® Extension for Dreamweaver® lets you transform a web-based application into a desktop application. Users can then run the application on their desktops and, in some cases, without an Internet connection.
You can use the extension with Dreamweaver CS3 and later. It is not compatible with Dreamweaver 8.
Adobe AIR does not support Adobe InContext Editing. If you use the AIR Extension for Dreamweaver to export an application that contains InContext Editing regions, the InContext Editing functionality will not work.
Install the AIR Extension for Dreamweaver
The AIR Extension for Dreamweaver helps you to create rich Internet applications for the desktop. For example, you might have a set of web pages that interact with each other to display XML data. You can use the Adobe AIR Extension for Dreamweaver to package this set of pages into a small application that can be installed on a user’s computer. When the user runs the application from their desktop, the application loads and displays the website in its own application window, independent of a browser. The user can then browse the website locally on their computer without an Internet connection.
Dynamic pages such as Adobe® ColdFusion® and PHP pages won’t run in Adobe AIR. The runtime only works with HTML and JavaScript. However, you can use JavaScript in your pages to call any web service exposed on the Internet—including ColdFusion- or PHP-generated services—with Ajax methods such as XMLHTTPRequest or Adobe AIR-specific APIs.
System requirements
To use the Adobe AIR Extension for Dreamweaver, the following software must be installed and properly configured:
Dreamweaver CS3 or later
Adobe® Extension Manager CS3 or later
Java JRE 1.4 or later (necessary for creating the Adobe AIRfile). The Java JRE is available at http://java.sun.com/.
The preceding requirements are only for creating and previewing Adobe AIR applications in Dreamweaver. To install and run an Adobe AIRapplication on the desktop, you must also install Adobe AIR on your computer. To download the runtime, see www.adobe.com/go/air.
Install the Adobe AIR Extension for Dreamweaver
-
-
Double-click the .mxp extension file in Windows Explorer(Windows) or in the Finder (Macintosh).
-
Follow the onscreen instructions to install the extension.
-
After you’re finished, restart Dreamweaver.
For information about using the Adobe AIR Extension for Dreamweaver, see Using the AIR Extension for Dreamweaver.
Create an AIR application in Dreamweaver
To create an HTML-based AIR application in Dreamweaver, you select an existing site to package as an AIR application.
-
Make sure that the web pages you want to package into an application are contained in a defined Dreamweaver site.
-
In Dreamweaver, open the home page of the set of pages you want to package.
-
Select Site > Air Application Settings.
-
Complete the AIR Application and Installer Settings dialog box, and then click Create AIR File.
For more information, see the dialog box options listed below.
The first time you create an Adobe AIR file, Dreamweaver creates an application.xml file in your site root folder. This file serves as a manifest, defining various properties of the application.
The following describes the options in the AIR Application and Installer Settings dialog box:
Application File Name
is the name used for the application executable file. By default, the extension uses the name of the Dreamweaver site to name the file. You can change the name if you prefer. However, the name must contain only valid characters for files or folder names. (That is, it can only contain ASCII characters, and cannot end with a period.) This setting is required.
Application Name
is the name that appears on installation screens when users install the application. Again, the extension specifies the name of the Dreamweaver site by default. This setting does not have character restrictions, and is not required.
Application ID
identifies your application with a unique ID. You can change the default ID if you prefer. Do not use spaces or special characters in the ID. The only valid characters are 0-9, a-z, A-Z, . (dot), and - (dash). This setting is required.
Version
specifies a version number for your application. This setting is required.
Initial Content
specifies the start page for your application. Click the Browse button to navigate to your start page and select it. The chosen file must reside inside the site root folder. This setting is required.
Description
lets you specify a description of the application to display when the user installs the application.
Copyright
lets you specify a copyright that is displayed in the About information for Adobe AIR applications installed on the Macintosh. This information is not used for applications installed on Windows.
Window Style
specifies the window style (or chrome) to use when the user runs the application on their computer. System chrome surrounds the application with the operating system standard window control. Custom chrome (opaque) eliminates the standard system chrome and lets you create a chrome of your own for the application. (You build the custom chrome directly in the packaged HTML page.) Custom chrome (transparent) is like Custom chrome (opaque), but adds transparent capabilities to the edges of the page, allowing for application windows that are not rectangular in shape.
Window Size
specifies the dimensions of your application window when it opens.
Icon
lets you select custom images for the application icons. (The default images are Adobe AIR images that come with the extension.) To use custom images, click the Select Icon Images button. Then, in the Icon Images dialog box that appears, click the folder for each icon size and select the image file you want to use. AIR only supports PNG files for application icon images.
Note:Selected custom images must reside in the application site, and their paths must be relative to the site root.
Associated File Types
lets you associate file types with your application. For more information, see the section that follows.
Application Updates
determines whether the Adobe AIR Application Installer or the application itself performs updates to new versions of Adobe AIRapplications. The check box is selected by default, which causes the Adobe AIR Application Installer to perform updates. If you want your application to perform its own updates, deselect the checkbox. Keep in mind that if you deselect the checkbox, you then need to write an application that can perform updates.
Included Files
specifies which files or folders to include in your application. You can add HTML and CSS files, image files, and JavaScript library files. Click the Plus (+) button to add files, and the folder icon to add folders. You should not include certain files such as _mmServerScripts, _notes, and so on. To delete a file or folder from your list, select the file or folder and click the Minus (-) button.
Digital Signature
Click Set to sign your application with a digital signature. This setting is required. For more information, see the section that follows.
Program Menu Folder
specifies a subdirectory in the Windows Start Menu where you want the application’s shortcut created. (Not applicable on Macintosh.)
Destination
specifies where to save the new application installer (.air file). The default location is the site root. Click the Browse button to select a different location. The default file name is based on the site name with an .air extension added to it. This setting is required.
The following is an example of the dialog box with some basic options set:
Sign an application with a digital certificate
A digital signature provides an assurance that the code for an application has not been altered or corrupted since its creation by the software author. All Adobe AIR applications require a digital signature, and can’t be installed without one. You can sign your application with a purchased digital certificate, create your own certificate, or prepare an Adobe AIRI file (an Adobe AIR intermediate file) that you’ll sign at a later time.
-
In the AIR Application and Installer Settings dialog box, click the Set button next to the Digital Signature option.
-
In the Digital Signature dialog box, do one of the following:
To sign an application with a pre-purchased digital certificate, click the Browse button, select the certificate, enter the corresponding password, and click OK.
To create your own self-signed digital certificate, click the Create button and complete the dialog box. The certificate Type option refers to the level of security: 1024-RSA uses a 1024-bit key (less secure), and 2048-RSA uses a 2048-bit key (more secure). When you’re finished click OK. Then enter the corresponding password in the Digital Signature dialog box and click OK.
Select Prepare an AIRI package that will be signed later and click OK. This option lets you create an AIR Intermediate (AIRI) application without a digital signature. A user is not able to install the application, however, until you add a digital signature.
About Timestamping
When you sign an Adobe AIR application with a digital certificate, the packaging tool queries the server of a timestamp authority to obtain an independently verifiable date and time of signing. The timestamp obtained is embedded in the AIR file. As long as the signing certificate is valid at the time of signing, the AIR file can be installed, even after the certificate has expired. On the other hand, if no timestamp is obtained, the AIR file ceases to be installable when the certificate expires or is revoked.
By default, the Adobe AIR Extension for Dreamweaver obtains a timestamp when creating an Adobe AIR application. You can, however, turn timestamping off by deselecting the Timestamp option in the Digital Signature dialog box. (You might want to do this, for example, if a timestamping service is unavailable.) Adobe recommends that all publically distributed AIR files include a timestamp.
The default timestamp authority used by the AIR packaging tools is Geotrust. For more information on timestamping and digital certificates, see Digitally signing an AIR file.
Edit associated AIR file types
You can associate different file types with your Adobe AIR application. For example, if you want file types with an .avf extension to open in Adobe AIR when a user double-clicks them, you can add the .avf extension to your list of associated file types.
-
In the AIR Application and Installer Settings dialog box, click the Edit list button next to the Associated File Types option.
-
In the Associated File Types dialog box, do one of the following:
Select a file type and click the minus (-) button to delete the file type.
Click the plus (+) button to add a file type.
If you click the plus button to add a file type, the File Type Settings dialog box appears. Complete the dialog box and click OK to close it.
Following is a list of options:
Name
specifies the name of the file type that appears in the Associated File Types list. This option is required, and can only include alphanumeric ASCII characters (a-z, A-Z, 0-9) and dots (for example, adobe.VideoFile). The name must start with a letter. The maximum length is 38 characters.
Extension
specifies the extension of the file type. Do not include a preceding dot. This option is required, and can only include alphanumeric ASCII characters (a-z, A-Z, 0-9). The maximum length is 38 characters.
Description
lets you specify an optional description for the file type.
Content Type
specifies the MIME type or media type for the file (for example text/html, image/gif, and so on).
Icon File Locations
lets you select custom images for the associated file types. (The default images are Adobe AIR images that come with the extension.)
Edit AIR application settings
You can edit the settings for your Adobe AIR application at any time.
-
Select Site > AIR Application Settings and make your changes.
Preview a web page in an AIR application
You can preview an HTML page in Dreamweaver as it would appear in an Adobe AIR application. Previewing is useful when you want to see what a web page will look like in the application without having to create the entire application.
-
On the Document toolbar, click the Preview/Debug in Browser button, and then select Preview In AIR.
You can also press Ctrl+Shift+F12 (Windows) or Cmd+Shift+F12 (Macintosh).
Use AIR code hinting and code coloring
The Adobe AIR Extension for Dreamweaver also adds code hinting and code coloring for Adobe AIR language elements in Code view in Dreamweaver.
-
Open an HTML or JavaScript file in Code view and enterAdobe AIR code.
Note:The code hinting mechanism only works inside <script> tags, or in .js files.
For more information on the Adobe AIR language elements, see the developer documentation in the rest of this guide.
Access the Adobe AIR documentation
The Adobe AIR extension adds a Help menu item in Dreamweaver that lets you access Developing AIR Applications with HTML and Ajax.
-
Select Help > Adobe AIR Help.