I have just written up a new tutorial on getting started Flex2/AS3 development with FlashDevelop. The tutorial should take about 30 minutes to complete and should get you up and running ready to get into Flex2 with AS3.
Read the Flex2/AS3 with FlashDevelop tutorial
This is certainly not anything groundbreaking, however I thought it might be useful to offer a step by step guide to getting up and running for Flex2/AS3 development without spending a bean on software*.
*N.B. gaping flaw in comment: you will however need Windows to do all of this which is of course not free. Unfortunately this tutorial is for setting up a Flex2/AS3 development environment for Windows. I might get around to exploring a similar setup on Linux but at the moment this is my preferred setup as FlashDevelop will only run on Windows.
This tutorial is essentially an idiot proofing of the (already fairly idiot proof) instructions on FlashDevelop.org. However, I originally struggled with this and know of a few others who have also, so dont feel bad if you’re reading this having struggled elsewhere (it’s easy when you know how eh? I dont really think you or I am an idiot). This tutorial is aimed at those wishing to get into some Flex2/AS3 development but haven’t had a chance to do much yet.
The Environment
We are going to step through the setup of our development environment and build a hello world Flex2/AS3 application using the following:
Pre-requisites
Before anything will work you’ll need to make sure you have a couple of things installed. Firstly check you have the Microsoft .NET 1.1 SP1 framework if not you need to download Microsoft .NET 1.1 SP1 framework.
Secondly you’ll need the flash player for Internet Explorer and it’s worth getting the “projector content debug release” for ease of testing (saves having to open IE everytime you want to test) visit the Adobe Flash Player download page for these. Once downloaded, right click on a .swf file, select Open With and select “Flash Player 9 r28″, this will mean when you test your movies they’ll run in the standalone player.
You will also need the java 1.5 runtime installed (to check your version click Start, Run, type “cmd” hit enter, type “java -version” hit enter). That should hopefully be everything you need to complete the rest of this tutorial.
Installing FlashDevelop
The first step is to install FlashDevelop, download it from FlashDevelop.org in the “Releases” forum, this tutorial is written at the time of release 2.0.2 (so don’t blame me if things change for later versions). Run the installer and follow along as you would any other install.
NOTE: by default FlashDevelop comes ready to run for AS2 projects. If you plan to do AS2 and AS3 development (as I do) I would suggest changing the installed path to “C:\Program Files\FlashDevelop_AS2″ or wherever you wish to install it, we will make a duplicate for Flex2/AS3 projects shortly. If you plan on using Flex2/AS3 only then ignore this comment.
That is all there is to installing FlashDevelop, easy eh? This is one of the reasons it’s getting so much kudos in the OSFlash community.
What about Flex2/AS3????
Ah yes, that’s what we’re here for isn’t it? As noted above, if you plan on doing AS2 development in FlashDevelop as well as AS3, I would recommend making a copy of the Program Files folder you originally installed FlashDevelop to. I made a copy to C:\Program Files\FlashDevelop_AS3, this means you can switch seemlessly between the two without having to change classpaths or settings. If you only plan to do Flex2/AS3 then carry on as you are.
Flex2 SDK
If you don’t already have it, download the Flex2 SDK from Adobe and extract it somewhere on your PC (I extracted to c:\Flex2\flex_2_sdk). We now need to tell FlashDevelop where it is, look for a file called settings.xml in C:\Program Files\FlashDevelop_AS3\Settings\ (you might need to run FlashDevelop.exe and close it before settings.xml is created) (edit: thanks Phillipe) In FlashDevelop click Tools, Program Settings (or press F9) and make sure that the key ASCompletion.Flex2Sdk.Path has the correct path to the flex2 sdk we extracted earlier. This has now enabled the Flex2 mxmlc compiler.
AS3 Code Completion
In order to have the AS3 intellisense and code completion you’ll need to download the AS3 Intrinsic Classes and extract them anywhere (I chose C:\Flex2\AS3_intrinsic_classes). Now open FlashDevelop and press Ctrl + F9 to open the global classpaths dialog, add the path to the AS3 intrinsic classes and close FlashDevelop.
Because we’re using this setup for Flex2/AS3 development only we now need to remove all AS2 reminants. To do this download the AS3 top-level declaration and extract anywhere (except for in the AS3 intrinsic classes folder, I chose C:\Flex2\as3_toplevel). Open FlashDevelop and hit Ctrl+F9 again to open the global classpath dialog and remove the first classpath (%userprofile%\Local Settings\Application Data\Macromedia\Flash MX 2004\en\Configuration\Classes).
Now go to program settings (F9) and set the ASCompletion.Macromedia.Classpath key to the path of the as3 top level declarations (in my case C:\Flex2\as3_toplevel) and also set the ASCompletion.MTASC.UseStdClasses key to false.
MXML completion
The final step is to enable MXML completion. To do this download the MXML definition and extract it to your FlashDevelop’s data folder (in my case C:\Program Files\FlashDevelop_AS3\Data).
And that is it for setup! You should now have a Flex2/AS3 development environment ready to go. If you want to jump straight in I would suggest reading up on the AS3/MXML custom @mxmlc quickbuild tag, however if you want to make sure everything is working stick with me for an amazingly exciting HelloWorld!!!!
HelloWorld! AS3
Open FlashDevelop (make sure you open the FlashDevelop.exe in your FlashDevelop_AS3 folder if you kept an AS2 version).
Click Project,
Click New Project,
Select Empty Project,
Enter the project name “HelloWorldAS3″ and choose where you want the project created.
You should see in the right hand project explorer a panel with your project file,
right click that and select Add, New Class
Enter the class name “HelloWorld” click OK,
Your HelloWorld Class will appear,
Click Syntax, AS3. You can test this now by typing the following:
[as]
package
{
import flash.display.Sprite;
import flash.text.TextField;
public class HelloWorld extends Sprite
{
function HelloWorld()
{
var t:TextField = new TextField();
t.text = “HelloWorld!”;
addChild(t);
}
}
}
[/as]
If you type the above (instead of copy paste) replacing the default class structure (that’s AS2) you should notice you have AS3 intellisense and code completion! Cool eh?
Now to run the project, simply click the Quick MTASC Build button (grey cog with a red bug on it) and if all has gone to plan you should see your first AS3 swf file created and loaded for your viewing pleasure. If it worked congratulations! If not, post a comment here or on the FlashDevelop.org forums and I’m sure we’ll get it sorted.
HelloWorld! MXML
Now we all know AS3 isn’t Flex2 and Flex2 isn’t AS3, it all comes together when we introduce MXML, Flex2’s markup language. Fortunately we’ve just setup a very cool environment for creating this very thing, so without further ado:
Open FlashDevelop if it’s not already running,
Click Project, New Project
Select Empty Project
Name the project “HelloWorldMXML”, choose where you wish it to save and click OK,
In the project explorer on the right, right click HelloWorldMXML and select Add, New Xml File…
Name the file “HelloWorld.mxml” and click OK,
Now type the following into your mxml file:
[xml]
horizontalAlign="center" verticalAlign="center"
>
[/xml]
Again, you should notice you have mxml intellisense and code completion making it a breeze to knock up an mxml layout.
Once done click the Quick MTASC Build button and whoosh, you should see your first Flex2 swf created and displayed. If so well done, if not post a message or hit the forums.
Next head over to the Adobe Flex2 quickstarts and start finding your way around Flex2 and AS3!
Any comments, suggestions, corrections, questions etc feel free to bang into the comments.
One of the challenges Adobe face with Apollo will be how wide an audience they can reach in a short amount of time. The golden target would be of course, to reach similar levels of adoption as the Flash Player. However this is a mamouth task and will certainly not happen over night.
The other query that springs to mind is whether Apollo needs that kind of distribution? Are the benefits Apollo offers going to be capitalised by the open public market (E.g. YouTube apps, eBay apps, Amazon apps etc.) that become household names and can be found in every home, web cafe and office workers desktop. Or will the big benefits by drawn by closed audience Intranet and Extranet applications?
Apollo deployment figures will be an interesting one to watch and will be very much influenced by the creation of popular applications. Another consideration for RIA enthusiasts is whether to create a solely online application or create a version for web browser access, a beefed up version for local installation and even mobile specific implementations. The flexibility of the platform should allow for the catering of these different platforms without the need for complete re-development each time. Approaches like this should greatly benefit the adoption rate of Apollo by offering extra sugar for users that try the online versions of applications.
Larry Constantine writes about an alternative to User Centred Product Development (a development approach focusing on users). The discussed alternative is Activity Centred Development which moves focus towards the job in hand that is to be done by the users.
Some interesting points that stand out to me:
Designing for use rather than for users is a way to focus design more sharply.
“Focus upon humans,†he wrote, “detracts from support for the activities themselves.†The result can be cool technology that doesn’t work and complex applications that don’t help people do the stuff they need to do.
paying too close attention to users and what they say can lead to timid, overly conservative design that does little more than repeat the mistakes of the past in a pretty new package
A third problem with users is that there are so many of them. And they are all different. They want different things and like different things and react differently.
I think that some of the argument touches grey areas that a good user interface designer/application developer can assess for themselves but overall an interesting view on the focus of application development.
After reading a comment recently about the number of windows application developers who will jump on the RIA bandwagon with the introduction of WPF, I got to wondering if the argument stands the other way round. The initial comment was along the lines of “Windows application devs don’t understand that web apps are different…” which, is a pretty weak argument really but that isn’t the point of this post.
My query is whether or not with the introduction of Apollo, will this promote the creation of many non-web applications built using web technologies? The web developer audience who are familiar with flash/flex and/or HTML & AJAX is vast to say the least. Will the opportunity to leverage these skills on the desktop see a rise in non-web specific applications being developed using web technolgoies.
It just so happens that an absolutely ideal case in point example arose on the blogosphere today: fauxto.com is a photoshop like graphics tool created entirely in Flex, currently this is an online tool, but I’m sure I’m not the only person who saw how well suited to Apollo this would be. Ryan Stewart has also made callings of a similar nature (this guy seems to be on my wavelength with every Apollo thought I have – which is hopefully a good thing considering his profile in the dev community).
During Mike Chambers’ presentation at FOTB his exact words (or very similar) were “Apollo isn’t for creating the next version of photoshop… I’m sure someone will, but that’s not where we’re aiming”. Well it appears someone has done that already and I wonder what other non-web related apps will come about despite that not being Adobe’s focus with Apollo.
I’ll save the argument on desktop app developers vs internet app developers for another post 
.
Have just confirmed with Tink that in Feburary I’ll be doing a presntation on Apollo at the London Flash Platform User Group.
More info when I have prepared a little more.
Ryan Stewart has a blog post containing an interview with Alan Lewis of with EffectiveUI who are the developers of an Apollo app in development for eBay known as the San Dimas project. I saw a demo of this app at FOTB and it looks very impressive.
One particular part grabbed my interest:
“Alan also mentioned that one of the big advantages of the desktop model is improved caching. For instance there is a web service call to go out and grab the entire tree structure of eBay’s categories. In XML format, this is about a 20 meg download. With Apollo, the team can call this once and cache it on the local machine so that the application never has to make the calls to get subcategories. This means fewer calls to the server and better performance.”
The use of caching and local storage is a key area of Apollo that is perhaps the most alien to web application developers. Short of browser cache and cookies we’ve had no form of local storage available. The above quote highlights the performance opportunities available through caching (something I’d not previously considered). Caching information about the site that never (or infrequently) changes could help greatly improve performance and reduce bandwidth.
Also the ability to make use of local file storage is what will really aid disconnected applications. In the instance of San Dimas you might be able to create and manage your eBay items for sale whilst not online then, once you have a web connection, commit them all to eBay. A couple of other examples I can think of off the top of my head:
Being able to continue to use a web application when offline should greatly reduce frustration for users. Have you ever spent ages filling in an online form of some sort or spending forever writing a page of content only to find that when you’ve submitted it you’ve lost your web connection and all your hard work gets lost?
I made a rather long post about Apollo in general, I intend to explore in a little more depth some of the opportunities that will arise as Apollo emerges onto the scene.
One of my first thoughts is on the implications of being able to create rich internet (desktop integrated) apps without any of the imposing restrictions of the browser. I think this is a neccessary step for RIAs and will go towards further defining the distinction between web applications and websites.
People have said for years now one of the downfalls of Flash is that you can’t use the browsers “Back” button. Well, it’s common knowledge that you can code around this issue and cater for Back buttoners, but should you have to?
As I eluded to, a web application is not a web site. The back button is merely a built in function of the [current] means to access a web application and it is here where the perception of web apps has been cloudy in the past. A web application is an application developed to perform a specific task that is enabled through web technologies. Until now we have been used to, and only used a web browser to access such an application as that is all we have had available. On reflection, the browser is perhaps not the right tool with which to access web applications, web apps were certainly not what browsers were originally designed for.
Apollo seems to be a platform that is lending itself to this purpose, if your application doesn’t need to offer Back, Forward, Refresh, Bookmark functionality… then don’t offer it.
I finally decided to get a new look to the blog, I’ve chosen Vistered Little by Nik Iliadis check out his site The Scary Little Monkey for some of the best looking works I’ve seen for any blog.
I’m hoping to create and add some custom Flash widgets in the future, but seeing as it’s taken best part of 6 months to download a different theme, I wont hold my breath 
This post is written from some notes I took at Mike Chambers’ Presentation @ FOTB – Apollo. This is very much as at time of writing and it is very likely that some of this will quickly become out of date information. If anyone spots any glaring mistakes please post a comment and I will rectify it.
“Apollo” is the codename of a new technology from Adobe that has currently reached an internal release. Mike Chambers, Senior Product Manager for Developer Relations at Adobe gave an excellent overview of how Apollo is shaping out. Here is a summary of my notes from his presentation he gave at Flash On The Beach earlier this week.
Apollo is a desktop runtime that enables desktop RIAs built in Flash, Flex, HTML and/or AJAX and any combination there in. One of the key advantages of having a local machine runtime for what have been traditionally web applications, is the ability to make use of local resources such as file I/O (e.g accessing mp3s, saving local images, saving configurations or data for offline working etc.).
Apollo applications will be developed essentially to work locally as per traditional software, however with an inherent access to online technologies, services and APIs. This is essentially freeing online application developers from the restrictions of the browser. No worrying about inappropriate use of the back button, if you need a back button, you implement a back button.
One of the huge advantages and key elements of Apollo is that it is going to be truely cross platform. You can develop for Apollo, deploy to windows, mac, linux. This is huge deal, no cross browser issues OR cross platform issues. One platform = one implementation with no need for dirty hacks and no restrictions on your audience.
Apollo application development caters for two primary development platforms: Flash & HTML. I think it is worth stressing that Apollo is “NOT JUST ABOUT FLASHâ€. You will not have to develop Apollo apps in Flash or Flex. you will be able to create a fully featured Apollo application using just HTML and Javascript (think Googlemaps with local file access for saving of locations and map images).
When developing an Apollo application, HTML content can contain Flash AND Flash content can contain HTML. This was demonstrated at Mike’s presentation and is something I have been wanting to appear in Flash for a long time. Basically you can add a rendered HTML page to a displaylist in Flash just the same way as you can add any other image. Imagine loading in a HTML document into a movieclip in your Flash movie, being able to apply rotation, scaling, filters etc but still being able to use it as a fully featured HTML page. In the presentation Mike loaded the Adobe homepage, rotated it 45 degrees, scaled it down, applied a blur and then was still able to navigate the site.
The chosen HTML Engine for Apollo is WebKit, this was chosen for the following reasons:
- Open Project
- Proven Technology
- Minimum file size
- Proven ability to run on mobile devices
Another feature of Apollo is that both Flash and HTML can integrate PDF, this wasn’t demonstrated and is still in development. I queried Mike on how downloads would work and he said that plugins will be required as needed. So rather than packaging the huge Acrobat reader to the Apollo runtime installer you can prompt for this if and when needed.
APIS
Apollo provides access to several desktop apis
Offiline / Occasionally connected to determine the current connectivity state and whether to poll an online service for the latest information/update personal settings or to use localised resources until a connection is available.
Complete Network support – http, xml/soap Binary and xml sockets
File I/O – synchronous AND asynchronous (sync for small files e.g settings, async for larger files e.g. playlist or photo album)
Local storage / Settings
Desktop Integration
Drag & Drop files to/from Apollo
Application shortcuts
System event notifications
These apis leads to potential Apollo apps that can run in the background I.e no need for any sort of UI until if and when needed. Apollo allows custom chrome, this means you have complete control over how your application looks. Shape and Alpha of application on desktop. Mike demonstrated there are currently two modes for chrome, system chrome or transparent chrome. System chrome will present your app in the default chrome for your operating system (I.e. right hand maximise, close minimse buttons in windows or ‘traffic light’ buttons on left in mac)
Installing an Apollo Application
There are currently planned, three methods to install Apollo apps:
.air extension – is a .zip packaged application.xml and swf. These installers are for if the user has Apollo on their machine they can simply double click the .air file et voila.
Native installer – creates windows/mac installer, includes checking for Apollo, if not present will install Apollo then your app
Web Install – “Express installâ€, install direct from web with a check for the Apollo runtime
My View
As you may be able to tell from the write-up I think Apollo is going to be big. It certainly looks to solve a lot of peoples problems and wishes. I would say the biggest thing of the moment is going to be ideas for implementation. We’re all used to either developing web applications or developing software applications. To my mind we’ve never had a platform that so smoothly destroys the boundary between online and offline software development and this new way of thinking will take some getting used to. I’m sure we’ll start off with a nice steady flow of photo galleries, aggregators etc but give it time and there’ll be some application concepts far beyond current considerations.
Other Notes
The following are some notes I made from the presentation that I intend to do some further research on and will post in due course:
Scripting
Low level interaction between HTML/JS and Flash
Flash can manipulate HTML DOM
Javascript could manipulate Flash’s drawing API
1.0 will launch for Win and Mac, Linux will be later
Command line tools – adt and adl to assist build of Apollo apps
HTML Flex control
Demo – Google Maps App
Accesses all local contacts, allows click of contact to find where on map they are
Demo – Picture this
Photo from webcam, converts to png, saves to filesystem – could have compressed to jpg with jpg library.
Demo – ScreenPlay
Allows drawing over desktop
Demo – Assassin
Allows monitoring of items on amazon, get desktop alerts for changes in availability, price, comments etc.
Application
At minimum will have 2 files, 1 swf/html/js and 1 xml
Xml – application properties, name, author etc, root application file, specify mac and windows icon or png which will dynamically generate icons
Timeline: beta on labs early 2007
1.0 mid-late 2007
More info:
www.adobe.com/go/apollo
weblogs.macromedia.com/mesh
mxna smart category
not aimed at kiosk/cd rom apps
security – undetermined as yet, multiple sandboxes – unknown author = web sandbox (restrict file access etc), digitally signed – full desktop privileges.
Flash player and acrobat reader will be prompted for as required.
Update mechanism for releasing application updates.
Copyright © 2010 Danny-T.co.uk
CSS Template By RamblingSoul | WordPress Theme by Theme Lab and Best Hosting.