flex Bindable使用讲解

最新推荐文章于 2017-05-26 08:14:56 发布

原创最新推荐文章于 2017-05-26 08:14:56 发布 · 496 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#flex #application #datagrid #layout #encoding #user

flex3 专栏收录该内容

138 篇文章

订阅专栏

本文介绍了一个使用Adobe Flex创建的应用示例，该应用展示了如何通过Bindable属性更新UI组件，包括Label和DataGrid的数据展示。示例中包含了按钮点击事件触发的数据更新逻辑。

<?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>