Flex UI Related

1：Accordion（层叠菜单）
//拖动一个Accordion组件到主场景，命名为myAccordion
// ·创建三个Accordion子菜单
myAccordion.createChild("View", "logins", {label:"登录界面"});
myAccordion.createChild("View", "infos", {label:"信息界面"});
myAccordion.createChild("View", "finishs", {label:"完成界面"});

//创建第一个子菜单的内容,把TextInput,Label组件加到子菜单中
var o=myAccordion.logins.createChild("TextInput","loginName");
var l=myAccordion.logins.createChild("Label","loginName",{text:"用户名："});
l.move(0,10)
o.move(70,10);
o.setSize(110,20);
var o=myAccordion.logins.createChild("TextInput","loginPass");
var l=myAccordion.logins.createChild("Label","loginPass",{text:"密　码："});
l.move(0,40)
o.move(70,40);
o.setSize(110,20);

//创建第二个子菜单的内容
o=myAccordion.infos.createChild("Label","info1",{text:"真实姓名：中原大帝"});
l=myAccordion.infos.createChild("Label","info2",{text:"家庭住址：云南昆明"});
l.move(0,30);
o.move(0,60);
l.setSize(150,20);
o.setSize(150,20);

//创建第三个子菜单的内容
o=myAccordion.finishs.createChild("Label","finish1",{text:"谢谢光临！"});
o.move(40,60);
o.setSize(150,20);

2:Alert（信息提示）
import mx.controls.Alert
var listenerObj:Object = new Object();
listenerObj.click = function(evt) {
    switch (evt.detail) {
    case Alert.OK:
   getURL("http://www.musicyear.net","_blank");
         break
    case Alert.CANCEL:
         trace("您按了 /"CANCEL/".");
         break;
    }
}
Alert.show("提示！您想进入音乐易耳吗?",
         "提示信息",
         Alert.OK | Alert.CANCEL,
         this,
         listenerObj);

3:Button（按钮）
//两个TextInput分别命名为minAge和maxAge，CheckBox组件命名为restrictAge
restrictAgeListener = new Object();
restrictAgeListener.click = function (evt){
minAge.enabled = evt.target.selected;
minAge.text = "输入最小年龄";
maxAge.enabled = evt.target.selected;
maxAge.text = "输入最大年龄";
}
restrictAge.addEventListener("click", restrictAgeListener);

4:ComboBox（组合框）
//ComboBox组件命名为my_comboBox
to_url = new Object();
to_url.change = function (evt){
//trace(evt.target.selectedItem.label);
getURL(evt.target.selectedItem.data);
}
my_comboBox.addEventListener("change", to_url);
相关函数：addItem() removeItemAt(n) getItemAt(n)
相关属性：selectedItem selectedIndex

///
5:DataGrid（数据网络）
//一个DataGrid命名为myGrid
var inbox = new Array();
inbox.push({来自: "海鸥", 主题: "关于PHP模板问题", 回复地址: "oo@abcd.com", 日期: "2003-10-26"});
inbox.push({来自: "波波", 主题: "回复: 主要功能", 回复地址: "byran@XX.com", 日期: "2003-10-26"});
inbox.push({来自: "钱大官", 主题: "PHP更新版本", 回复地址: "qm999@163.com", 日期: "2003-10-24"});
inbox.push({来自: "大帝", 主题: "关于新闻系统", 回复地址: "dadi@musicyear.net", 日期: "2003-10-23"});
inbox.push({来自: "一片空白", 主题: "回复: 没什么问题吧?", 回复地址: "webmaster@flashpub.net", 日期: "2003-10-10"});
inbox.push({来自: "中原", 主题: "没什么问题吧?", 回复地址: "zhongyuan@nicestart.net", 日期: "2003-10-09"});
myGrid.dataProvider = inbox;

///
6:Loader（读取器）
相关属性：autoload 是否自动读取，若为false，则必须使用Loader.load()才能读取
   scaleContent 是否调整读取内容适应loader尺寸
   contentPath 读取内容的相对/绝对路径
//一个Loader组件命名为myLoader
//一个ProgressBar组件命名为myProgress
myLoader.autoLoad = false;
myLoader.contentPath = "photo/example.jpg";
myProgress.source = myLoader;
myLoader.load();

///
7：RadioButton（单选按钮）
//两个RadioButton组件groupName均为sexGroup
//一个label组件命名为showInfo
radioListener = new Object();
radioListener.click = function (evt){
    showInfo.text = evt.target.selection.data
}
sexGroup.addEventListener("click", radioListener);

///
8：Menu（菜单）
(1)使用Menu内置方法创建菜单
//一个Button组件命名为commandBtn
var listener = new Object();
listener.click = function(evtObj) {
var button = evtObj.target;
if(button.menu == undefined) {
        // 创建一Menu实例并添加菜单项
        button.menu = mx.controls.Menu.createMenu();
        button.menu.addMenuItem("打开");
        button.menu.addMenuItem("关闭");
        button.menu.addMenuItem("保存");
        button.menu.addMenuItem("退出");

        // 添加一个改变菜单事件的听侦器
        var changeListener = new Object();
        changeListener.change = function(event) {
    var item = event.menuItem;
    trace("您选择了项目: " + item.attributes.label);
        }
        button.menu.addEventListener("change", changeListener);
    }
button.menu.show(button.x, button.y + button.height);
}
commandBtn.addEventListener("click", listener);
(2)使用xml文件数据创建菜单
System.useCodepage = true;
var myMenu = mx.controls.Menu.createMenu();
// 导入 XML 文件
var loader = new XML();
loader.menu = myMenu;
loader.ignoreWhite = true;
loader.onLoad = function(success) {
    // 数据读取完成
    if(success) {
      this.menu.dataProvider = this.firstChild;
    }
};
//导入的xml文件路径
loader.load("xml/menu.xml");
//显示菜单
myMenu.show();
/**********************************
menu.xml
<?xml version="1.0" encoding="gb2312"?>
<menu>
    <menuitem label="菜单A" >
      <menuitem label="子菜单A-1" />
      <menuitem label="子菜单A-2" />
    </menuitem>
    <menuitem label="菜单B" >
      <menuitem label="子菜单B-1" />
      <menuitem label="子菜单B-2" />
      <menuitem label="子菜单B-3" />
    </menuitem>
    <menuitem type="separator" />
    <menuitem label="单选项目一" type="radio" groupName="radioGroup_1" />
    <menuitem label="单选项目二" type="radio" groupName="radioGroup_1" />
    <menuitem label="单选项目三" type="radio" groupName="radioGroup_1" />
    <menuitem type="separator" />
    <menuitem label="复选－苹果" type="check" instanceName="buyApples" selected="true" />
    <menuitem label="复选－桔子" type="check" instanceName="buyOranges" selected="false" />
    <menuitem label="复选－香蕉" type="check" instanceName="buyBananas" selected="false" />
</menu>
**********************************/
(3)创建XML对象并制作菜单
System.useCodepage = true;
var s = "";
s += "<menu>";
s += "<menuitem label='撤销' />";
s += "<menuitem type='separator' />";
s += "<menuitem label='剪切' />";
s += "<menuitem label='复制' />";
s += "<menuitem label='粘贴' />";
s += "<menuitem label='清除' />";
s += "<menuitem type='separator' />";
s += "<menuitem label='全选' />";
s += "</menu>";
// 使用s字串创建 XML 对象
var xml = new XML(s);
xml.ignoreWhite = true;
// 用创建的 XML 对象创建菜单
var myMenu = mx.controls.Menu.createMenu(_root, xml.firstChild);
//显示菜单
myMenu.show();
(4)使用MenuDataProvider类创建菜单
System.useCodepage = true;
// 创建一个 XML 对象
var xml = new XML();
// 以下这项不会出现在菜单中.
var theMenuElement = xml.addMenuItem("Edit");
// 添加菜单项
theMenuElement.addMenuItem({label:"撤销"});
theMenuElement.addMenuItem({type:"separator"});
theMenuElement.addMenuItem({label:"剪切"});
theMenuElement.addMenuItem({label:"复制"});
theMenuElement.addMenuItem({label:"粘贴"});
theMenuElement.addMenuItem({label:"清除", enabled:"false"});
theMenuElement.addMenuItem({type:"separator"});
theMenuElement.addMenuItem({label:"全选"});
// 创建菜单对象
var theMenuControl = mx.controls.Menu.createMenu(_root, theMenuElement);
//显示菜单
theMenuControl.show();

9:MenuBar（菜单栏）
//一个MenuBar组件命名为myMenuBar
//添加菜单栏项目
var menu = myMenuBar.addMenu("文件(F)");
//添加子菜单
menu.addMenuItem({label:"新建", instanceName:"newInstance"});
menu.addMenuItem({label:"打开", instanceName:"openInstance"});
menu.addMenuItem({label:"关闭", instanceName:"closeInstance"});
menu.addMenuItem({type:"separator"});
menu.addMenuItem({label:"退出", instanceName:"quitInstance"});
//继续添加菜单项目和子菜单
var menu1 = myMenuBar.addMenu("编辑(E)");
menu1.addMenuItem({label:"全选", instanceName:"allInstance"});
var menu2 = myMenuBar.addMenu("查看(V)");
var menu3 = myMenuBar.addMenu("命令(C)");
var menu4 = myMenuBar.addMenu("窗口(W)");
var menu5 = myMenuBar.addMenu("帮助(H)");
//创建侦听器对象
var listen = new Object();
listen.change = function(evt){
var menu = evt.menu;
var item = evt.menuItem
if (item == menu.newInstance){
    myNew();
    trace(item);
}else if (item == menu.openInstance){
    myOpen()
    trace(item);
}
}
menu.addEventListener("change",listen);

10:ScrollPane（滚动面板）
//一个ScrollPane组件命名为myScrollPane
scrollListener = new Object();
scrollListener.scroll = function (evt){
    txtPosition.text = "目前垂直滚动条位置：" + myScrollPane.vPosition;
    txtPosition.text += "/n目前水平滚动条位置：" + myScrollPane.hPosition;
}
myScrollPane.addEventListener("scroll", scrollListener);

completeListener = new Object;
completeListener.complete = function() {
trace("swf文件读取完毕.");
}
myScrollPane.addEventListener("complete", completeListener);

///
11:Tree（树）
//一个Tree组件，命名为myTree
System.useCodepage = true;
listenerObject = new Object();
listenerObject.change = function(evtObject){
trace("选中项：" + evtObject.target.selectedItem.attributes.label);
}
myTree.addEventListener("change", listenerObject);
//方式一：调用外部XML文件
myTreeDP = new XML();
myTreeDP.ignoreWhite = true;
myTreeDP.load("xml/tree.xml");
myTreeDP.onLoad = function(){
myTree.dataProvider = myTreeDP;
}
//方式一完
/*方式二：使用TreeDataProvider类创建XML对象
var myTreeDP = new XML();
myTreeDP.addTreeNode("当前文件夹", 0);
// 创建子树
var myTreeNode = myTreeDP.firstChild;
myTreeNode.addTreeNode("收件箱", 1);
myTreeNode.addTreeNode("发送箱", 2);
myTreeNode.addTreeNode("草稿箱", 3);
myTreeNode.addTreeNode("废件箱", 4);
// 定义树的数据源
myTree.dataProvider = myTreeDP;
// 将子树的branches属性均设置为真
for(var i=0; i<myTreeNode.childNodes.length; i++){
    var node = myTreeNode.getTreeNodeAt(i);
    myTree.setIsBranch(node, true);
}
//方式二完*/
/*方式三：使用ActionScript创建XML
// 创建 XML 对象
var myTreeDP = new XML();
// 创建节点
var myNode0 = myTreeDP.createElement("node");
myNode0.attributes.label = "当前文件夹";
myNode0.attributes.data = 0;
var myNode1 = myTreeDP.createElement("node");
myNode1.attributes.label = "收件箱";
myNode1.attributes.data = 1;

var myNode2 = myTreeDP.createElement("node");
myNode2.attributes.label = "发件箱";
myNode2.attributes.data = 2;

var myNode3 = myTreeDP.createElement("node");
myNode3.attributes.label = "草稿箱";
myNode3.attributes.data = 3;

var myNode4 = myTreeDP.createElement("node");
myNode4.attributes.label = "废件箱";
myNode4.attributes.data = 4;

// 定义节点
myTreeDP.appendChild(myNode0);
myTreeDP.firstChild.appendChild(myNode1);
myTreeDP.firstChild.appendChild(myNode2);
myTreeDP.firstChild.appendChild(myNode3);
myTreeDP.firstChild.appendChild(myNode4);

myTree.dataProvider = myTreeDP;
//方式三完*/
/*方式四：使用字符串直接创建XML对象
myTreeDP = new XML("<node label='当前文件夹'><node label='收件箱' data='0'/><node label='发件箱' data='1'/></node>");
myTree.dataProvider = myTreeDP;
//方式四完*/

上面的脚本包含了四种XML创建方式，其中方式一的tree.xml文件源码如下
<?xml version="1.0" encoding="gb2312"?>
<node label="我的邮箱">
       <node label="收件箱"/>
       <node label="个人文件夹">
           <node label="公司文件" isBranch="true" />
           <node label="演示文件" isBranch="true" />
           <node label="个人文件" isBranch="true" />
           <node label="草稿箱" isBranch="true" />
       </node>
       <node label="发件箱" isBranch="true" />
       <node label="废件箱"/>
</node>
<node label="个人设置"/>