Up until now, everything should seem fairly familiar.  We've got a PHP script and a MySQL database.  Now it's time to start building the interface to our application.

Flex applications are built using a combination of ActionScript (AS) 3.0 and MXML.  ActionScript is based on ECMA Script (same as JavaScript), so it should be familiar to web developers.  MXML is an XML based layout engine for Flex applications.

Essentially, you lay out the UI using XML, and script the UI using ActionScript.  The MXML for our interface is, again, very simple (only 26 lines!).

<?xml version="1.0" encoding="utf-8"?>
    <mx:Application
xmlns:mx="http://www.macromedia.com/2005/mxml" xmlns="*"
layout="absolute" creationComplete="userRequest.send()">
        <mx:HTTPService id="userRequest"
url="http://localhost/flex/php/request.php" useProxy="false"
method="POST">
            <mx:request xmlns="">
        <username>{username.text}</username><emailaddress>
{emailaddress.text}</emailaddress>
    </mx:request>
    </mx:HTTPService>
        <mx:Form x="22" y="10" width="493">
            <mx:HBox>
             <mx:Label text="Username"/>
            <mx:TextInput id="username"/>
        </mx:HBox>
        <mx:HBox>
            <mx:Label text="Email Address"/>
            <mx:TextInput id="emailaddress"/>
        </mx:HBox>
        <mx:Button label="Submit" click="userRequest.send()"/>
    </mx:Form>
    <mx:DataGrid id="dgUserRequest" x="22" y="128" dataProvider="{userRequest.result.users.user}">
        <mx:columns>
            <mx:DataGridColumn headerText="User ID"
columnName="userid"/>
            <mx:DataGridColumn headerText="User Name"
columnName="username"/>
        </mx:columns>
    </mx:DataGrid>
    <mx:TextInput x="22" y="292" id="selectedemailaddress"
text="{dgUserRequest.selectedItem.emailaddress}"/>
</mx:Application>