Creating Your First AIR Application

Developing a bare-bones AIR application is simple. If you've worked through a fraction of the exercises in this book, you have the skills to build an AIR app. By doing a simple "Hello, World" exercise, you'll learn that you already have all the computer resources and programming skills to produce a working application. Follow these steps to create an animator's version of the old, reliable "Hello, World" program that's given so many people their first taste of a new programming language.

  1. Choose File→New→Adobe AIR 2, as shown in Figure 21-3.

    Flash creates a new document with a stage and timeline that looks just like your usual Flash workspace. Behind the scenes, there are differences, because Flash creates a document that uses the AIR runtime instead of Flash Player.

  2. Click the Text tool, and then in the Properties panel, choose TLF Text and Read Only.

    You use the same tools for AIR apps as you use for Flash animations.

  3. Click the stage and type some text, such as Hello Adobe AIR World.

    Change the font, color, and size so that it's large and attractive on the stage.

  4. In the timeline, click Frame 48 and then press F5.

    Flash adds new frames to the timeline.

  5. Right-click (Control-click) the timeline and then choose Create Motion Tween.

    The timeline changes to light blue, indicating a motion tween.

  6. Move the playhead to Frame 48.

    In the next step, you'll create a new property keyframe at this location.

  7. Choose the Transform tool, and then rotate the TLF text field.

    You can give it one or more spins. If you prefer, you can use the Motion Editor to move and transform the text field.

  8. Click the New Layer button and name the new layer actions.

    Time to add a smidgen of ActionScript, just to prove that it works in AIR. Keep in mind, your AIR applications use ActionScript 3.0 and won't work with ActionScript 2.0 or earlier.

  9. Right-click the 48th frame of the actions layer and press F6.

    A blank keyframe appears in the timeline, where you can add some code.

  10. Press F9 (Option-F9) or choose Window→Actions to open the Actions panel.

    You have access to the same ActionScript coding tools, including code hinting and code snippets.

  11. Type stop();

    This line simply stops the animation when it reaches the last frame.

  12. Press Ctrl-Enter (⌘-Return).

    After a little computing, your animation runs in a standard window that matches your Windows or Mac operating system, as shown in Figure 21-4. Additional details about the app appear in the Output panel.

Simple, yes. Underwhelming, probably. You might even say this example looks identical to a Flash animation when you test it. That's true, but remember that different things are going on under the hood. Instead of using Flash Player, your AIR application is powered by the AIR runtime.

Figure 21-4. Simple, yes. Underwhelming, probably. You might even say this example looks identical to a Flash animation when you test it. That's true, but remember that different things are going on under the hood. Instead of using Flash Player, your AIR application is powered by the AIR runtime.

Your first attempt at an AIR project proves that the various parts work. You use the standard tools, including tweens and ActionScript, to build applications that run in the Adobe Integrated Runtime.

Note

Interested in the process of developing a complex AIR app? There's a story on Adobe TV about an application developed by the Fiat car company. Their program uses data that's recorded to a thumb drive while your car is running. Plug the thumb drive into your computer at home, and the AIR app provides details on how to drive more economically to reduce your carbon emissions. Your data is pooled with other drivers in the Fiat community. According to the developers, the AIR app was developed in about 5 to 6 months. To find the video, go to http://tv.adobe.tv and search for the word Fiat. The video runs about 20 minutes, describing the project from both the client's and the developer's point of view.