146
Appendix A: Basic Flex Concepts
Typical application development steps
You typically develop a Flex application using the following steps:
1.
Create an MXML file with the
<mx:Application>
root tag.
2.
Add one or more containers.
3.
Add controls to a container, such as input fields, buttons, and output fields.
4.
Define a data model.
5.
Add a web service, HTTP service, or request to a remote object such as a Java object or a Flash
Remoting service.
6.
Add validation to input data.
7.
Add a script to extend a component.
About Flex files
Flex application development is based on the same iterative process used for developing other web
applications. Developing a Flex application is as easy as opening Flex Builder, inserting some
containers and components, and running the file. The basic difference between Flex and other
server technologies is that Flex generates Flash files (SWF files)—not HTML code.
Flex applications can consist of a mix of MXML and ActionScript. MXML is a tag-based
language for building Flex applications. ActionScript is a procedural-based language for
developing applications in Flash.
This section covers the following topics:
•
“About MXML files” on page 146
•
“About ActionScript files in Flex applications” on page 147
About MXML files
MXML is a XML-based language for building Flex applications. Like HTML, you can use
MXML to build web user interfaces. Unlike HTML, you can use MXML to pass data between
components, and between the presentation layer (the user interface) and the business layer (back-
end systems). For more information on the MXML language, see “Using MXML” in Developing
Flex Applications Help.
The following MXML code creates an input field, a button, and a text box. When the user clicks
the button, any text entered in the input field is copied to the text box.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.macromedia.com/2004/mxml"
width="200" height="100">
<!-- vertical box container for the application. -->
<mx:VBox id="myvbox">
<!-- input field -->
<mx:TextInput id="myInput" width="150" />
Summary of Contents for FLEX BUILDER-USING FLEX BUILDER
Page 1: ...Using Flex Builder...
Page 116: ...116 Chapter 4 Building a Flex User Interface Visually...
Page 144: ...144 Chapter 6 Working with Data...
Page 154: ...154 Appendix A Basic Flex Concepts...
