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:
<?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.
Related Entries
- Apollo Camp Twitter Application Released
- Apollo Cheat Sheets
- Simple HTML Based Apollo Example
- Why Apollo?
- Teknision on Apollo and Branded Applications
Comments
-
AlfioCool. 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)
-
Me too Alfio.. Mike the "Using the File System API" chapter really got me on fire! I can't wait..
-
BrentQuick question, is mx:HTML a component available in Flex2? Or is this a demo for Flex3?
-
mike chambers>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 chambers mesh@adobe.com
-
Great, really cool. Are we any closer to seeing the Apollo alpha or beta being made available to developers ? Mike
-
This is all soooo cool. Like a kid waiting for Christmas morning, I can't wait till the "Apollo" presents arrive. theo
-
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?
-
mike chambers>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/Desktop No need to check for OS. Apollo handles this. mike chambers mesh@adobe.com
-
Hi vijay.. Take a look here: http://www.oreilly.com/catalog/9780596513917/chapter/ it's really hot!