flex Bindable使用讲解
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal">
<mx:Panel width="392" height="300" layout="absolute">
<mx:Label x="19" y="10" text="{user}" width="171" height="20"/>
<mx:Button x="216" y="8" label="测试Bindable" click="bind()" width="105"/>
<mx:DataGrid x="19" y="58" dataProvider="{arr}">
<mx:columns>
<mx:DataGridColumn headerText="year" dataField="year"/>
<mx:DataGridColumn headerText="city" dataField="city"/>
<mx:DataGridColumn headerText="provice" dataField="provice"/>
<mx:DataGridColumn headerText="total" dataField="total"/>
</mx:columns>
</mx:DataGrid>
</mx:Panel>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.collections.ArrayCollection;
[Bindable]
private var user:String="HELLO";
[Bindable]
private var arr:ArrayCollection=new ArrayCollection([
{year:2009,city:"Shanghai",provice:"上海",total:580000},
{year:2009,city:"Beijing",provice:"河北省",total:7852020},
{year:2009,city:"Nanjing",provice:"江苏省",total:895145},
{year:2009,city:"Hangzhou",provice:"浙江省",total:4132415}]);
//修改了绑定的user和arr，并没有修改label和datagrid
private function bind():void{
this.user="HEllo22";
arr.removeItemAt(3);
}
]]>
</mx:Script>
</mx:Application>
相关文档：
1、预备知识
Flex是Adobe提供的基于Flash环境的RIA展现技术，主要采用MXML+Action Script来编写程序、界面，然后通过编译器编译成flash格式的SWF文件发布到网站上。
实现该功能需要安装Flex SDK，可以从Adobe网站上面下载，或者安装Flex Builder plugin+Eclipse来开发。
同时需要具备简单的正则表达式知识。
2、界面布� ......
在同一个Application中动态切换主题，这里采用的是动态引用不同的CSS文件。
具体步骤如下：
1）创建CSS文件
skyTheme.css
/* CSS file */
.backgroudSkin
{
&nbs ......
经常在Demo中会看到列表，表格等方式来显示数据。当然有时候也需要添加数据到这些列表或者表格中。有很多方式提交，这里展示一个弹出窗口的方式来添加新的数据到DataGrid中。
例子展示：
首先，我们开始建设一个基本的界面结构，一个带有“Notes"标题的Panel,一个DataGrid，以及一个用于提交数据的按钮。
Xml代码
& ......
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2007/08/07/creating-full-screen-flex-applications/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" applicationComplete="init(event)" viewSourceURL="srcview/index.html">
& ......
