CONTENTS

- RIA – What’s that?

- What is Flex?
- What is AIR?
- Why Flex instead of
Flash?
- Flex Sites
- Developing Flex
Application
- ActionScript and
XMXL?
- Recommended
 RIA – What’s that?
• RIA -> Rich Internet
Application

• Desktop Application on Web

Browser

• e.g. Flex/Flash, AIR, AJAX,

Silverlight, etc.
 What is Flex?
• Another Flash platform

• No timeline; Many
components

• For developing application

NOT animation
 What is AIR?

• AIR = Adobe Integrated

Runtime

• AIR = Flex/Flash/AJAX Web on

Desktop

• AIR -> ActionScript 3.0

 Why Flex instead of
Flash?
• Flex - No timeline; Easy to
build and deploy the
application; Appreciated by
developer (programmer);
FREE (open source)

• Flash – Developers hate

designing; More suitable for
animating and designing or
common website
Why Flex instead of
Flash?
(cont.)
• BUT we are using the same
script language!

• ActionScript 3.0
Flex Sites

flauntR
(http://www.flauntr.com/)

Online photo editing

Flex Sites

Volkswagen UK –
Used Car Locator
(http://www.volkswagen.co.uk/used/sea
rch)

Search and locate

the used
Volkswagen cars
Flex Sites

flex.org
Showcase
(http://flex.org/showcase/)

Flex sites showcase

resource
 Developing Flex
Application
• ActionScript 3.0 and MXML
• Recommended Tools
• Example
 Developing Flex Application
ActionScript 3.0 and
MXML
• ActionScript 3.0
– Flash, Flex, AIR
– OOP
– Flex 3 SDK

• MXML
– XML
– Flex interface (components)
 Developing Flex Application
ActionScript 3.0 and
MXML

ActionScript 3.0
Example
 Developing Flex Application
ActionScript 3.0 and
MXML

MXML Example
 Developing Flex Application
Recommended Tools
Adobe Flex
Builder 3
(http://www.adobe.com/products/fl
ex/)
Buy: $249

Flex MXML generator,

editor and
ActionScript 3.0 editor
 Developing Flex Application
Recommended Tools
FlashDevelop 3
(http://www.flashdevelop.org)
Free

ActionScript, MXML
editor
 Developing Flex Application
Example
Hello World Application
(1)
Pure AS 3.0 :: 1
file
package{

import flash.display.Sprite;
import flash.text.TextField;

public class HelloWorld extends Sprite{

public function HelloWorld(){

var textField:TextField = new TextField();
textField.text = "Hello World!";
addChild(textField);
}
}
}
 Developing Flex Application
Example
Hello World Application
(1)
Pure AS 3.0 :: 1
file
 Developing Flex Application
Example
Hello World Application
(2)
Pure MXML :: 1
file
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute">
<mx:Text text="Hello World!"></mx:Text>
</mx:Application>
 Developing Flex Application
Example
Hello World Application
(2)
Pure MXML :: 1
file