本文转自 xhinkerx 51CTO博客，原文链接http://blog.51cto.com/xhinker/134339，如需转载请自行联系原作者 看完了flex简略教程,由于是英文版的，所以有些地方还是没怎么明白。没办法只好自己慢慢试拉，今天把ComboBox和DataGrid的使用方法研 究了一下。为什么要选ComboBox和DataGrid呢？像button这类东西说是在没什么好讲的大家都明白。ComboBox的外表做出来了里面 的数据怎么办呢？问题就出在这里了。(如果不知道什么是Flex的话，看一下或许会有些帮助)

 

所谓ComboBox就是下拉菜单了  1 2 3 4  (在博客里搞出这东西也不容易啊,代码在下面附上)

先给出一段代码:

<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx=" " layout="absolute"> <mx:Script>     <![CDATA[          [Bindable]

        public var cards: Array = [ {label:"xhinker1", data:"1.jpg"},

            {label:"xhinker2", data:"2.jpg"}, {label:"xhinker3",      data:"3.jpg"} ];             [Bindable]         public var selectedItem1:Object;          [Bindable]          public var selectedItem2:Object;          ]]> </mx:Script>

  <mx:ComboBox x="10" y="10" dataProvider="{cards}" width="150"

            close="selectedItem2=ComboBox(event.target).selectedItem">

</mx:ComboBox>     <mx:HBox x="168" y="10" width="368">             <mx:Label text="You selected: {selectedItem2.label}"/>             <mx:Label text="Data: {selectedItem2.data}" width="168"/>     </mx:HBox>

</mx:Application>

不要害怕，重要的地方都用黑体标出来了。[bindable]是捆绑标记，这样数据就可以与部件进行动态交换数据。之后就是combobox里选项的内容了， Array是属性声明，label是外面看到的选项，data就是真正的数据内容。上面例子中数据是图片的地址，图片放在bin文件下。第二段黑体就是真正的combobox了。下面一段可有可无，用来检验的。注意红色的部分这些是需要自己声明的。

 

下面讲DataGrid,首先把代码全部给出来：

<mx:XMLList id="employees">         <employee>             <name>xhinker1</name>             <phone>555-219-2270</phone>             <email>[email]ccoenraets@fictitious.com[/email]</email>             <active>true</active>         </employee>         <employee>             <name>xhinker2</name>             <phone>555-219-2012</phone>             <email>[email]jwall@fictitious.com[/email]</email>             <active>true</active>         </employee>         <employee>             <name>xhinker3</name>             <phone>555-219-2012</phone>             <email>[email]maurice@fictitious.com[/email]</email>             <active>false</active>         </employee>         <employee>             <name>xhinker4</name>             <phone>555-219-2000</phone>             <email>[email]mjones@fictitious.com[/email]</email>             <active>true</active>         </employee> </mx:XMLList>

这里是用xml存储数据将来会在表格中显示出来.

<mx:DataGrid id="dg"  rowCount="4" dataProvider="{employees}" enabled="true">         <mx:columns>             <mx:DataGridColumn dataField="name" headerText="Name"/>             <mx:DataGridColumn dataField="phone" headerText="Phone"/>             <mx:DataGridColumn dataField="email" headerText="Email"/>         </mx:columns> </mx:DataGrid>

这一段就把数据显示出来了也不是太难了，adobe flex不提供傻瓜式输入，我们就得辛苦一点自己输入了。

---