自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

Flex數(shù)據(jù)綁定的四種方式

作者：xiang08
開發(fā) 后端
本文向大家介紹一下幾種Flex數(shù)據(jù)綁定的方式，將數(shù)據(jù)放到界面上去的過程可以叫住數(shù)據(jù)綁定。Flex數(shù)據(jù)綁定共有四種方式，這里會為你一一介紹。

本文和大家重點(diǎn)討論一下Flex數(shù)據(jù)綁定的幾種方式，在Flex中，F(xiàn)lex數(shù)據(jù)綁定主要有四種方式，分別為："{}"綁定表達(dá)式、[Bindable]綁定符號、<mx:Binding>標(biāo)簽和BindingUtils動態(tài)綁定，下面一一對這四種Flex數(shù)據(jù)綁定方式進(jìn)行詳細(xì)介紹。

Flex數(shù)據(jù)綁定 

現(xiàn)在數(shù)據(jù)庫或是某個(gè)文件里有一些數(shù)據(jù)需要顯示在界面上該怎么辦呢？我們的目的就是將這些數(shù)據(jù)設(shè)法放到界面上去可以顯示出來，這個(gè)將數(shù)據(jù)放到界面上去的過程可以叫住Flex數(shù)據(jù)綁定。

在Flex應(yīng)用中程序中，F(xiàn)lex數(shù)據(jù)綁定的實(shí)際是借助事件機(jī)制來完成的，當(dāng)目標(biāo)使用Flex數(shù)據(jù)綁定的時(shí)候，目標(biāo)對象就會監(jiān)聽數(shù)據(jù)源對象的某一固定事件。當(dāng)數(shù)據(jù)源發(fā)生變化時(shí)，數(shù)據(jù)源會派發(fā)改變事件通知目標(biāo)對象更新數(shù)據(jù)。實(shí)際開發(fā)中我們不需要去關(guān)注具體的實(shí)現(xiàn)過程，這個(gè)過程Flash/Flex會自動去完成。

在Flex中，F(xiàn)lex數(shù)據(jù)綁定主要有四種方式，分別為："{}"綁定表達(dá)式、[Bindable]綁定符號、<mx:Binding>標(biāo)簽和BindingUtils動態(tài)綁定，下面一一對這四種Flex數(shù)據(jù)綁定方式進(jìn)行詳細(xì)介紹。

一、"{}"綁定表達(dá)式

Flex開發(fā)中，"{}"綁定表達(dá)式的應(yīng)用是最為常見的，簡單、方便。好比ASP.NET中的"<%%>"一樣的功效。這里我就簡單介紹下，在Flex下怎么使用"{}"綁定表達(dá)式來綁定數(shù)據(jù)。如有這樣一個(gè)簡單的需求，我們定義一個(gè)變量，通過"{}"綁定表達(dá)式將變量的值綁定到文本框或是按扭等類似的UI組件上，變量定義如下：

  1. 1<mx:Script> 
  2. 2<![CDATA[  
  3. 3[Bindable]  
  4. 4internalvartext:String="嗨，這是通過\"{}\"表達(dá)式綁定的!";  
  5. 5]]> 
  6. 6</mx:Script> 

如上定義了一個(gè)字符串的變量text，我們通過"{}"綁定表達(dá)式將其綁定在UI組件上呢？如下：

  1. 1<mx:Buttonxmx:Buttonx="97"y="122"label="{this.text}"fontSize="12"/> 
  2. 2<mx:Labelxmx:Labelx="97"y="152"text="{this.text}"fontSize="12"/> 
  3. 3<mx:Textxmx:Textx="97"y="178"text="{this.text}"fontSize="12"/> 

簡潔、簡單、方便且適用。OK，已經(jīng)學(xué)到手了，那下面繼續(xù)看看另一種綁定使用方式--綁定方法返回值。例如需要將一個(gè)方法的返回值通過"{}"綁定表達(dá)式進(jìn)行Flex數(shù)據(jù)綁定，讓其在UI組件上呈現(xiàn)該怎么做呢？如下方法定義：

  1. 1privatefunctionBindText():String  
  2. 2{  
  3. 3return"通過\"{}\"表達(dá)式綁定方法！";  
  4. 4} 


其實(shí)和上面一樣，直接將"{}"里的變量改為方法便OK，如下代碼段：

<mx:Labelx="114"y="277"text="{BindText()}"fontSize="12"/>
如上便完成了對方法的綁定，既將BindText()方法的值綁定在了Label組件上。#p#

二、[Bindable]綁定符號

[Bindable]綁定符號在上面就已經(jīng)出現(xiàn)過了，他的使用和作用也很容易掌握。如上示例，我們的目的是將定義的變量值綁定在UI組件上，如果要實(shí)現(xiàn)這個(gè)功能，直接將定義的變量通過"{}"綁定表達(dá)式進(jìn)行Flex數(shù)據(jù)綁定是不能完成功能的，我們必須為所定義的變量標(biāo)記[Bindable]。在Flex中，只有標(biāo)記有[Bindable]的數(shù)據(jù)源才能進(jìn)行Flex數(shù)據(jù)綁定（函數(shù)除外，上面示例中也證實(shí)了這一點(diǎn)），當(dāng)然也可以是其他的數(shù)據(jù)源（xml,數(shù)據(jù)庫,文件等不同地方不同類型的數(shù)據(jù)源）。

上面這樣使用確實(shí)很簡單，但還是需要更加深入的了解[Bindable]。當(dāng)指定了[Bindable]的數(shù)據(jù)源發(fā)生改變的時(shí)候，仍然是通過所監(jiān)聽的事件方法來處理的“通知”，默認(rèn)為"propertyChange"事件。如之前定義的變量text，那么完整的定義應(yīng)該如下所示：

1[Bindable(event="propertyChange")]
2internalvartext:String="嗨，這是通過\"{}\"表達(dá)式綁定的!";
“propertyChange”事件為默認(rèn)事件，通常我們只需要使用簡寫形式[Bindable]就OK了。除此之外還需要注意兩點(diǎn)（這里就不做介紹，在后續(xù)文章里我會詳細(xì)介紹）：

1、[Bindable]標(biāo)簽用于函數(shù)時(shí)，只能在setter和getter方式定義的函數(shù)前使用，這種綁定稱之為函數(shù)級綁定。

2、[Bindable]標(biāo)簽用于公有類時(shí)，這個(gè)類的所有公共變量，setter和getter方式定義的函數(shù)都可以用于綁定。這種綁定稱為對象級綁定。

三、<mx:Binding>標(biāo)簽

<mx:Binding>標(biāo)簽也是使用非常頻繁的Flex數(shù)據(jù)綁定方式。到底怎么個(gè)用法呢？下面以兩個(gè)小示例使用不同的數(shù)據(jù)源來進(jìn)行Flex數(shù)據(jù)綁定演示。首先用<mx:Model>標(biāo)簽定義一個(gè)數(shù)據(jù)源（<mx:Model>標(biāo)簽就相當(dāng)于的定義一個(gè)臨時(shí)數(shù)據(jù)，這里不做詳細(xì)介紹，不清楚它的作用的朋友請查閱相關(guān)資料學(xué)習(xí)）。<mx:Model>標(biāo)簽定義數(shù)據(jù)源如下：

  1. 1<mx:Modelidmx:Modelid="books"> 
  2. 2<Books> 
  3. 3<Book> 
  4. 4<Name>ActionScript3.0</Name> 
  5. 5<Author>張三</Author> 
  6. 6</Book> 
  7. 7<Book> 
  8. 8<Name>FlashCS3</Name> 
  9. 9<Author>李四</Author> 
  10. 10</Book> 
  11. 11</Books> 
  12. 12</mx:Model> 

如上定義的數(shù)據(jù)源，通過<mx:Binding>標(biāo)簽來進(jìn)行Flex數(shù)據(jù)綁定是很簡單的，如下代碼段：

  1. 1<mx:Bindingsourcemx:Bindingsource="books.Book[0].Name"destination="txtName.text"/> 
  2. 2<mx:Bindingsourcemx:Bindingsource="books.Book[1].Name"destination="txtAuthor.text"/> 
  3. 3  
  4. 4<mx:TextInputxmx:TextInputx="95"y="71"id="txtName"fontSize="12"/> 
  5. 5<mx:TextInputxmx:TextInputx="95"y="115"id="txtAuthor"fontSize="12"/> 

<mx:Model>標(biāo)簽可以用來定義XML式的數(shù)據(jù)源，另外還可以通過編程的方式定義數(shù)據(jù)源或從數(shù)據(jù)庫、文件或各種數(shù)據(jù)服務(wù)接口來獲取數(shù)據(jù)源，下面是使用xml的數(shù)據(jù)源定義：

  1. 1privatevarxml:XML=<Books> 
  2. 2<Book> 
  3. 3<Name>ActionScript3.0</Name> 
  4. 4<Author>張三</Author> 
  5. 5</Book> 
  6. 6<Book> 
  7. 7<Name>FlashCS3</Name> 
  8. 8<Author>李四</Author> 
  9. 9</Book> 
  10. 10</Books> 

綁定xml對象的數(shù)據(jù)和通過<mx:Model>標(biāo)簽定義的數(shù)據(jù)源沒什么區(qū)別，詳細(xì)如下代碼塊：

  1. 1<mx:Bindingsourcemx:Bindingsource="xml.Book[0].Name"destination="txtXmlName.text"/> 
  2. 2<mx:Bindingsourcemx:Bindingsource="xml.Book[1].Name"destination="txtXmlAuthor.text"/> 
  3. 3<mx:TextInputxmx:TextInputx="95"y="177"id="txtXmlName"fontSize="12"/> 
  4. 4<mx:TextInputxmx:TextInputx="95"y="225"id="txtXmlAuthor"fontSize="12"/> 

#p#

四、BindingUtils與動態(tài)綁定

在Flex數(shù)據(jù)綁定中，動態(tài)綁定主要是通過BindingUtils類提供的兩個(gè)靜態(tài)方法來實(shí)現(xiàn)。該類位于包mx.binding.utils下，它提供了bindProperty()和bindSetter()兩個(gè)靜態(tài)方法來實(shí)現(xiàn)數(shù)據(jù)的動態(tài)綁定。

bindProperty（）方法根據(jù)名稱就可以看出大概意思，綁定屬性。那實(shí)際開發(fā)中我們應(yīng)該怎么應(yīng)用他呢？其實(shí)很簡單，一句話概括就是：將xx的YY屬性綁定到AA的BB屬性。更清楚的理解這句話的意思見下面代碼片段：

  1. 1<?xmlversionxmlversion="1.0"encoding="utf-8"?> 
  2. 2<mx:Applicationxmlns:mxmx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"layout="absolute"> 
  3. 3<mx:Script> 
  4. 4<![CDATA[  
  5. 5importmx.binding.utils.BindingUtils;  
  6. 6  
  7. 7privatevarmyName:String="張三";  
  8. 8  
  9. 9internalfunctiononClick():void  
  10. 10{  
  11. 11BindingUtils.bindProperty(nameText,"text",btn,"label");  
  12. 12}  
  13. 13]]> 
  14. 14</mx:Script> 
  15. 15<mx:TextInputxmx:TextInputx="84"y="83"id="nameText"text=""/> 
  16. 16<mx:Buttonxmx:Buttonx="102"y="153"label="動態(tài)綁定"id="btn"click="onClick()"/> 
  17. 17</mx:Application> 

這段代碼很簡單，在界面上分別放置了輸入組件和一個(gè)按扭組件，然后定義了一個(gè)字符串(String)類型的變量myName，***通過按扭的單擊事件將按扭的"label"屬性綁定到輸入組件的"text"屬性上。其實(shí)onClick()方法里的代碼和下面這一句代碼是完全等價(jià)的：

  1. 1this.nameText.text=this.btn.label; 


bindSetter（）方法的使用也很簡單，該Flex數(shù)據(jù)綁定方法綁定數(shù)據(jù)需要與setter類似的方法結(jié)合，將外部傳遞進(jìn)去的參數(shù)進(jìn)行方法委托實(shí)現(xiàn)數(shù)據(jù)的動態(tài)綁定，拿上面將按扭顯示值綁定到文本輸入組件的值的示例來說，只需要定義一個(gè)setter的方法，該bindProperty()方法為bindSetter()方法既可，詳細(xì)見下面代碼片段：

  1. 1<?xmlversionxmlversion="1.0"encoding="utf-8"?> 
  2. 2<mx:Applicationxmlns:mxmx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml"layout="absolute"> 
  3. 3<mx:Script> 
  4. 4<![CDATA[  
  5. 5importmx.binding.utils.BindingUtils;  
  6. 6  
  7. 7privatevarmyName:String="張三";  
  8. 8  
  9. 9internalfunctiononClick():void  
  10. 10{  
  11. 11//BindingUtils.bindProperty(nameText,"text",btn,"label");  
  12. 12BindingUtils.bindSetter(bindText,btn,"label");  
  13. 13}  
  14. 14  
  15. 15internalfunctionbindText(text:String):void  
  16. 16{  
  17. 17this.nameText.text=text;  
  18. 18}  
  19. 19]]> 
  20. 20</mx:Script> 
  21. 21<mx:TextInputxmx:TextInputx="84"y="83"id="nameText"text=""/> 
  22. 22<mx:Buttonxmx:Buttonx="102"y="153"label="動態(tài)綁定"id="btn"click="onClick()"/> 
  23. 23</mx:Application> 
  24.  

 【編輯推薦】

  1. 解析三大Flex數(shù)據(jù)綁定方式
  2. Flex數(shù)據(jù)綁定的概念解讀
  3. Flex數(shù)據(jù)綁定中難以發(fā)現(xiàn)的無聲錯誤
  4. FlexBuilder3.0與Eclipse3.4的***結(jié)合
  5. 剖析Flex DataGrid分頁控件的兩種分頁形式用法

 

責(zé)任編輯：佚名 來源： csdn.net
Flex數(shù)據(jù)綁定
相關(guān)推薦

2010-08-05 09:33:08

Flex頁面跳轉(zhuǎn)

2013-06-14 15:24:57

Android開發(fā)移動開發(fā)數(shù)據(jù)存儲方式

2010-08-05 13:44:12

Flex布局

2010-08-11 14:09:07

Flex3.0數(shù)據(jù)綁定

2011-03-14 13:33:32

Oracle數(shù)據(jù)庫啟動

2017-03-10 08:39:33

2010-08-06 14:28:55

Flex CSS樣式

2010-07-30 09:16:24

Flex數(shù)據(jù)綁定

2022-03-25 14:47:24

Javascript數(shù)據(jù)類型開發(fā)

2023-05-22 08:03:28

JavaScrip枚舉定義

2017-04-17 19:31:03

Android多線程

2020-06-12 08:28:29

JavaScript開發(fā)技術(shù)

2010-08-13 13:31:48

Flex效果組件

2014-12-25 09:41:15

Android加載方式

2021-12-22 09:34:01

Golagn配置方式

2013-10-17 09:25:52

2010-07-30 11:03:54

Flex數(shù)據(jù)綁定

2010-08-02 16:47:46

Flex

2010-04-19 16:08:31

Oracle數(shù)據(jù)庫

2015-04-02 16:54:52

災(zāi)難恢復(fù)VDI災(zāi)難恢復(fù)
點(diǎn)贊
收藏

51CTO技術(shù)棧公眾號