Using TextMate for building Apollo applications: Setting up

In my previous entry I described “5 reasons for building Apollo applications as a Flash Developer”. Today I’ll give you an introduction for building an Apollo application without Flex Builder 2 using Apollo SDK (Alpha) and TextMate.

Instruction

1. Download Flex 2.0.1 SDK and the Apollo SDK.
2. Open Terminal and create a new folder typing mkdir /Applications/flex_sdk2.
3. Unzip both downloaded files. Type in your opened Terminal window unzip /{downloadFolder}/flex_sdk_2.zip -d /Applications/flex_sdk2 and unzip /{downloadFolder}/apollo_sdk_alpha1_031907.zip -d /Applications/flex_sdk2. Accept the replacing of “Version.as” and “mxmlc.jar” twice. Note: Don’t unzip the files using Stuffit Expander.
4. For installing the Apollo runtime open the /Applications/flex_sdk2/runtime in Finder and double-click the Adobe Apollo.dmg file. Drag the Adobe Apollo.frameworkfolder contained in the *.dmg file to the /Applications/flex_sdk2/runtime directory.
5. Configure the environment variable$PATH in your .bash_profile with pico. Type in Terminal pico .profile and add the following line export PATH=$PATH:/Applications/flex_sdk2/bin/. Save and close pico. Refresh .bash_profile typing (Note the double points with space) . .bash_profile and check it with echo $PATH.
6. Open TextMate and create a new project (⌃⌘N) named “textMateMeetsApollo.tmproj”.
7. Place a root content for Apollo creating a new file “HelloWorld.mxml” including following code:

   HelloWorld.mxml

   1. <?xml version="1.0" encoding="utf-8"?>
   2. <mx:ApolloApplication xmlns:mx="http://www.adobe.com/2006/mxml"
   3.   layout="absolute"
   4.   title="TextMate meets Apollo"
   5.   backgroundColor="0×000000">
   6.   <mx:Label htmlText="TextMate meets Apollo"
   7.     fontSize="28"
   8.     color="0xFFFFFF"
   9.     horizontalCenter="0"
   10.     verticalCenter="0"/>
   11. </mx:ApolloApplication>
   In this case it’s a simple Flex file including a Label component.
8. Then add a XML file called “HelloWorldApp.xml” which defines the properties for your Apollo application:

   HelloWorldApp.xml

   1. <?xml version="1.0" encoding="UTF-8"?>
   2. <application xmlns="http://ns.adobe.com/apollo/application/1.0.M3"
   3.     version="1.0"
   4.     appId="HelloWorld">
   5.     <properties>
   6.         <name>Example for building an Apollo Application with TextMate</name>
   7.         <publisher>sectore [www.websector.de]</publisher>
   8.         <description>A sample Apollo application</description>
   9.     </properties>
   10.     <rootContent systemChrome="standard" transparent="false">HelloWorld.swf</rootContent>
   11. </application>

9. For easier handling define a TextMate command to compile your Apollo application. Open the project information panel (⌘I) and add two shell variables named APOLLO_APP and APOLLO_DESCRIPTOR.

   

10. Finally create a command opening the command panel (⌃⌥⌘C). Add a new bundle named “Apollo” and a new command called “build” as well. For running the compiler I’ve chosen STRG+ENTER.

    

    Source of TextMates build command:

    tm_buildApolloApp.command

    1. # Source some support functions we need.
    2. . "${TM_SUPPORT_PATH}/lib/html.sh"
    3. . "${TM_SUPPORT_PATH}/lib/webpreview.sh"
    4.  
    5. html_header "TextMate meets Apollo"
    6.  
    7. echo ‘<h2>Building Apollo App"’
    8. echo $APOLLO_APP
    9. echo ‘"</h2>’
    10. echo ‘<p>’
    11. amxmlc $TM_PROJECT_DIRECTORY/$APOLLO_APP
    12. echo ‘</p>’
    13.  
    14. echo ‘<h2>Test Apollo App "’
    15. echo $APOLLO_DESCRIPTOR
    16. echo ‘"</h2>’
    17. echo ‘<p>’
    18. adl $TM_PROJECT_DIRECTORY/$APOLLO_DESCRIPTOR
    19. echo ‘</p>’
    20.  
    21. html_footer

Screen shots

TextMates output window:

Apollo window:

Download

Source: textMateApolloExample.zip
(Downloads: 1131)

Links

• Open book: “Apollo for Flex Developer”
• Adobe Labs: Installing and configuring the Apollo SDK and Creating an Apollo application using the command line tools
• Adobe Apollo Forum: Can not unzip the SDK on a Mac

Feedback and suggestions

Feedback and suggestions for improvement are welcome, especially smarter commands for TextMate . And is there anyone out there to create an Apollo bundle script for TextMate feel free to drop a comment, too.[EDIT: 04/04/07] I’ve just found that Tyler Hall has already build an Apollo bundle for TextMate. Check it out! [EDIT]

Apollo