Home > Adobe Flex/Air > First Flex program using Flex SDK 3 and FLashDevelop

First Flex program using Flex SDK 3 and FLashDevelop

Recently, i’ve been learning something new called Adobe Flex and i’m really impressed by how easy it be to create smooth interfaces. (I’m not good at design, so thanks god that Adobe has supplied a great Framework)

First, to develop Flex you need an IDE. Adobe gives us one called Adobe Flex Builder here around 249$. But maybe this is this a problem, right? Then, after trying to search aroung the Internet, i found one way to develop Flex totally free

Steps to install:

  • Run FlashDevelop-3.0.2-RTM.exe to setup FlashDevelop
  • Extract Flex SDK to anywhere you want (i put in C:\Flex)
  • Double click on designview.air to setup screen design tool

Before starting to play around with Flex, we need some settings.

  • Open the FlashDevelop
  • Go to Tools > Program Settings and choose AS3Context under Plugins list
  • Set [Flex SDK Location] point to where you have placed Flex SDK (mine is C:\Flex)

Now we have prepared anything needed to develop Flex. Let’s create an easiest program.

1. From FlexDevelop [Project] menu, click New Project
2. Once the window is opened, select [Flex 3 Project] and input project name (Remember to check on [Create directory for project])
3. There’ll be a file called Main.mxml under [src] directory which is used as our main place for coding.
i want to display a button, if this button is clicked then a message box’ll be shown. so let’s input some code as below into Main.mxml

<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml”>
import mx.controls.Alert;
public function showMsg():void {
Alert.show("Hello World");
<mx:Button label=”Click me” click=”showMsg()” />

4. Click on the project’s name and select properties then set Test Movie to [Play in popup]
5. Click [Test Movie] to run
6. What do you see?

Categories: Adobe Flex/Air Tags:
  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: