flex中ComboBox和datagrid的使用

简介:



本文转自 xhinkerx 51CTO博客,原文链接http://blog.51cto.com/xhinker/134339,如需转载请自行联系原作者 看完了flex简略教程,由于是英文版的,所以有些地方还是没怎么明白。没办法只好自己慢慢试拉,今天把ComboBox和DataGrid的使用方法研 究了一下。为什么要选ComboBox和DataGrid呢?像button这类东西说是在没什么好讲的大家都明白。ComboBox的外表做出来了里面 的数据怎么办呢?问题就出在这里了。(如果不知道什么是Flex的话,看一下flex入门或许会有些帮助)
 
所谓ComboBox就是下拉菜单了  1 2 3 4  (在博客里搞出这东西也不容易啊,代码在下面附上)
先给出一段代码:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx=" [url]http://www.adobe.com/2006/mxml[/url]" 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不提供傻瓜式输入,我们就得辛苦一点自己输入了。

下拉菜单的博客代码<SELECT size=1 name=select> <OPTION selected>1</OPTION> <OPTION>2</OPTION> <OPTION>3</OPTION> <OPTION>4</OPTION></SELECT>
目录
相关文章
|
1月前
|
C# 数据库 开发者
44.c#:combobox控件
44.c#:combobox控件
29 1
|
1月前
|
Python
Combobox
在Tkinter中,下拉菜单(Combobox)是一种常用的组件,它允许用户从一组预定义的选项中选择一个或多个值。下面是关于如何在Tkinter中使用下拉菜单组件的详细说明:
32 1
|
9月前
C#-DataGrid的使用(一)
DataGrid的使用
44 0
|
9月前
|
数据可视化
C#-DataGrid的使用(二)
DataGrid的使用
30 0
C#-DataGrid的使用(三)
C#-DataGrid的使用
36 0
|
.NET 开发框架 存储

热门文章

最新文章