Example Code for 360Flex Apollo Session

During my Apollo overview session at 360Flex, I built a simple HTML editor that provided live preview and allowed the HTML to save to the desktop. It is a pretty simple app, but it shows an example of using both the File API in Apollo as well as HTML.

I mentioned in the session that I would post it online, so here it is:


PRE {font : normal normal normal 12 “Courier New”, Courier, Arial;;} 

<?xml version="1.0" encoding="utf-8"?><mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"><mx:Script><![CDATA[import flash.filesystem.FileMode;import flash.filesystem.FileStream;import flash.filesystem.File;/* Called when the user wants to save the file */private function onSave():void{//Get a reference to the desktop        var desktop:File = File.desktopDirectory;//create a reference to the file on the desktop in which we will save html        var saveFile:File = desktop.resolve(fileName.text);//create a FileStream instance to write to the file        var fs:FileStream = new FileStream();//open file in WRITE mode        fs.open(saveFile, FileMode.WRITE);//write the string to the file        fs.writeUTFBytes(input.text);//close the file / file stream        fs.close();}/* called when text in the TextArea changes */private function onTextChange():void{//pretty simple. Copy text from TextArea into HTML control as HTML        html.htmlText = input.text;}]]></mx:Script><!-- Used to enter HTML --><mx:TextArea right="0" left="0" id="input" top="0" height="139" textInput="onTextChange()"/><!-- Save Button --><mx:Button label="Save" id="saveButton" bottom="10" right="10" click="onSave()"/><!-- File Name on Desktop to save HTML in --><mx:TextInput id="fileName" right="72" bottom="10" text="test.html" /><!-- HTML field to do live preview of HTML --><mx:HTML right="0" left="0" top="147" bottom="40" id="html"/></mx:Application>

Post any questions in the comments.

9 Responses to Example Code for 360Flex Apollo Session

  1. Alfio says:
    March 9, 2007 at 10:51 am

    Cool. I look forward to using Apollo when the alpha or even beta for that matter comes out. Still waiting on my Apollo book from Amazon. ;o)

  2. Savvas Malamas says:
    March 9, 2007 at 11:42 am

    Me too Alfio..Mike the “Using the File System API” chapter really got me on fire!I can’t wait..

  3. Brent says:
    March 9, 2007 at 12:00 pm

    Quick question, is mx:HTML a component available in Flex2? Or is this a demo for Flex3?

  4. mike chambers says:
    March 9, 2007 at 12:13 pm

    >Quick question, is mx:HTML a component available in Flex2? Or is this a demo for Flex3?It is included in the Apollo SDK.mike chambersmesh@adobe.com

  5. mike baker says:
    March 9, 2007 at 12:31 pm

    Great, really cool.Are we any closer to seeing the Apollo alpha or beta being made available to developers ?Mike

  6. Theo Rushin says:
    March 9, 2007 at 5:13 pm

    This is all soooo cool. Like a kid waiting for Christmas morning, I can’t wait till the “Apollo” presents arrive.theo

  7. vijay says:
    March 10, 2007 at 12:39 am

    Hi,Something just crossed my mind whilst looking at the above code. Apollo is meant to be cross-platform. How does “File.desktopDirectory” resolve on a MAC??Or for instance, how does the runtime engine know to look at the right folder if I were working on a PC and the person next to me works of a MAC? Do I need to use the “flash.system.os” right at the start to determine the required OS?I am sure this was well thought about by the team…any insight on this?

  8. mike chambers says:
    March 10, 2007 at 8:32 am

    >Something just crossed my mind whilst looking at the above code. Apollo is meant to be cross-platform. How does “File.desktopDirectory” resolve on a MAC??Mac has a concept of a Desktop. So on a Mac File.desktopDirectory resolves to:/Users/USERNAME/DesktopNo need to check for OS. Apollo handles this.mike chambersmesh@adobe.com