在MXML中定义用户界面
我们的程序可以由一个或是多个MXML文件组成。使用多个MXML文件可以促进代码重用,简化构建复杂程序的过程,并且使得多个开发者贡献同一个工程变得更为容易。
下面的例子是一个MXML程序,这个程序使用一个按钮控件来触发从一个文本输入控件拷贝文本到一个文本区控件:
<?xml version="1.0" encoding="utf-8"?>
<!-- ?xml tag must start in line 1 column 1 -->
<!-- MXML root element tag. -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<!-- Flex controls exist in a container. Define a Panel container. -->
<mx:Panel title="My Application">
<!-- TextInput control for user input. -->
<mx:TextInput id="myInput" width="150" text=""/>
<!-- Output TextArea control. -->
<mx:TextArea id="myText" text="" width="150"/>
<!-- Button control that triggers the copy. -->
<mx:Button id="myButton" label="Copy Text"/>
</mx:Panel>
</mx:Application>
这个程序第一行指明了XML声明,而且必须放在MXML文件的第一行,第一列。
第二行以<mx:Application>标签开始,这是Flex程序的根元素。这个标签包含了Flex名字空间声明。在起始与结束的<mx:Application>标签之间的部分定义了Flex程序。
下图演示了在Flash播放器中运行这个程序的效果图:
正如这段代码所写的,这个例子布局了我们的用户界面,但是却并没有包含从文本输入框控件到文本区控件的拷贝逻辑。