小男孩‘自慰网亚洲一区二区,亚洲一级在线播放毛片,亚洲中文字幕av每天更新,黄aⅴ永久免费无码,91成人午夜在线精品,色网站免费在线观看,亚洲欧洲wwwww在线观看

搜索
分享

Flex編程模型

 鬼迷心竅 2007-12-11
Flex編程模型

Flex包含F(xiàn)lex類庫，MXML以及ActionScript程序語言，如下表所示：

包含在Flex中，但是卻并沒有在上圖中顯示的還有Flex編譯以及Flex調(diào)試器。
我們使用MXML與ActionScript的組合來編寫Flex程序。MXML和ActionScript程序語言都給了我們?cè)L問Flex類庫的能力。使用MXML來定義程序的用戶界面元素，使用ActionScript來定義客戶邏輯與過程控制。
Flex類庫包含F(xiàn)lex組件，管理器與行為。使用基于組件的Flex開發(fā)模型，開發(fā)者可以合并預(yù)編譯的組件，創(chuàng)建新的組件，或者是組合預(yù)編譯的組件為復(fù)合組件。

Flex類庫與MXML和ActionScript的關(guān)系
Flex是作為ActionScript類庫來實(shí)現(xiàn)的。這個(gè)類庫包含組件（容器與控件），管理類，數(shù)據(jù)服務(wù)類以及其他特性的類。我們使用MXML和ActionScript語言配合類庫來開發(fā)程序。
MXML標(biāo)簽與ActionScript類或是類的屬性相對(duì)應(yīng)。Flex分析MXML標(biāo)簽，并且編譯包含相應(yīng)ActionScript對(duì)象的SWF文件。例如，F(xiàn)lex提供了ActionScript Button類來定義Flex按鈕控件。在MXML中，我們可以用下面的MXML語句來創(chuàng)建一個(gè)按鈕控件：
<mx:Button label="Submit"/>
當(dāng)我們使用MXML標(biāo)簽聲明了一個(gè)控件，我們就創(chuàng)建了那個(gè)類的一個(gè)實(shí)例。這個(gè)MXML語句創(chuàng)建了一個(gè)按鈕對(duì)象，并且初始化這個(gè)按鈕對(duì)象的label屬性為Submit字符串。
與ActionScript類相對(duì)應(yīng)的MXML使用與ActionScript類相同的命名約定。類名以一個(gè)大寫字母開頭，而且在類名中以大寫字母分隔單詞。每一個(gè)MXML標(biāo)簽屬性對(duì)應(yīng)著ActionScript對(duì)象的一個(gè)屬性，適合于對(duì)象的一種風(fēng)格，或者是這個(gè)對(duì)象的一個(gè)事件監(jiān)聽器。

布局我們的程序
我們使用代表用戶界面的組件來聲明Flex程序的用戶界面。有兩種類型的組件：控件與容器。控件是窗體元素，如按鈕，文本框，列表框。容器是屏幕上包含控件和其他容器的矩形區(qū)域。
在Flex的根部是單一的容器，稱之為程序容器，這代表整個(gè)Flash播放器的界面。這個(gè)程序容器保存所有的其他的代表對(duì)話框，面板和窗體的容器。
一個(gè)容器有預(yù)定義的規(guī)則來布局他的孩子容器和控件，包括尺寸以及位置。Flex定義了布局規(guī)則來簡化富網(wǎng)絡(luò)程序的設(shè)計(jì)與實(shí)現(xiàn)，然而也提供了足夠的靈活性來使得我們可以創(chuàng)建多樣的程序集合。
使用預(yù)定義的布局規(guī)則的一個(gè)優(yōu)點(diǎn)就是我們的用戶可以很快的習(xí)慣我們的程序。也就是說，通過標(biāo)準(zhǔn)化用戶交互的規(guī)則，我們的用戶就不需要考慮如何來導(dǎo)航程序，相反卻可以集中于程序所提供的內(nèi)容。
另一個(gè)優(yōu)點(diǎn)就是我們不必在定義導(dǎo)航以及作為設(shè)計(jì)一部分的布局規(guī)則上花費(fèi)大量的時(shí)間。相反，我們可以集中精力于我們想要傳遞的信息以及我們要提供給用戶的選擇，并且不需為所有用戶行為的細(xì)節(jié)與程序響應(yīng)擔(dān)心。通過這樣的方式，F(xiàn)lex提供了一個(gè)結(jié)構(gòu)可以讓我們快速容易的使用豐富的特性與交互集合來開發(fā)程序。

使用Flex Builder來布局我們的程序
我們可以使用Flex Builder構(gòu)建Flex程序的用戶界面。我們可以使用Flex Builder通過可視的編碼與設(shè)計(jì)工具來開發(fā)Flex與ActionScript程序。我們也可以使用可以提供代碼提示與代碼輔助特性的編輯編寫MXML，ActionScript與CSS代碼，從而幫助我們的開發(fā)工作。
在這個(gè)編輯器中，我們可以切換到設(shè)計(jì)模式來可視化的開發(fā)我們的程序，在設(shè)計(jì)畫布上使用容器與組件，使用約束來布局我們的組件，并查看運(yùn)行時(shí)用戶界面的轉(zhuǎn)化。然后我們使用定制的編譯器來構(gòu)建我們的工程，并且使用集成的調(diào)試工具來調(diào)試我們的工程。

在MXML中定義用戶界面
我們的程序可以由一個(gè)或是多個(gè)MXML文件組成。使用多個(gè)MXML文件可以促進(jìn)代碼重用，簡化構(gòu)建復(fù)雜程序的過程，并且使得多個(gè)開發(fā)者貢獻(xiàn)同一個(gè)工程變得更為容易。
下面的例子是一個(gè)MXML程序，這個(gè)程序使用一個(gè)按鈕控件來觸發(fā)從一個(gè)文本輸入控件拷貝文本到一個(gè)文本區(qū)控件：
<?xml version="1.0" encoding="utf-8"?>
<!-- ?xml tag must start in line 1 column 1 -->
<!-- MXML root element tag. -->
<mx:Application xmlns:mx="
    <!-- Flex controls exist in a container. Define a Panel container. -->
    <mx:Panel title="My Application">
        <!-- TextInput control for user input. -->
        <mx:TextInput id="myInput" width="150" text=""/>
        <!-- Output TextArea control. -->
        <mx:TextArea id="myText" text="" width="150"/>
        <!-- Button control that triggers the copy. -->
        <mx:Button id="myButton" label="Copy Text"/>
           
    </mx:Panel>
</mx:Application>
這個(gè)程序第一行指明了XML聲明，而且必須放在MXML文件的第一行，第一列。
第二行以<mx:Application>標(biāo)簽開始，這是Flex程序的根元素。這個(gè)標(biāo)簽包含了Flex名字空間聲明。在起始與結(jié)束的<mx:Application>標(biāo)簽之間的部分定義了Flex程序。
下圖演示了在Flash播放器中運(yùn)行這個(gè)程序的效果圖：

正如這段代碼所寫的，這個(gè)例子布局了我們的用戶界面，但是卻并沒有包含從文本輸入框控件到文本區(qū)控件的拷貝邏輯。

向Flex程序中添加ActionScript
我們可以為了下列目的使用ActionScript
處理事件 Flex用戶界面是事件驅(qū)動(dòng)的。例如，當(dāng)用戶選擇一個(gè)按鈕時(shí)，這個(gè)按鈕生成一個(gè)事件。我們?cè)贏ctionScript中定義名為事件監(jiān)聽器的函數(shù)來處理事件。我們的事件監(jiān)聽器可以打開一個(gè)窗口，播放SWF文件，或者是執(zhí)行我們的程序所必須的任何動(dòng)作。
處理錯(cuò)誤 我們?cè)贏ctionScript處理運(yùn)行時(shí)錯(cuò)誤。我們可以檢測(cè)數(shù)據(jù)驗(yàn)證錯(cuò)誤，向用戶發(fā)送錯(cuò)誤信息，向服務(wù)器重新提交請(qǐng)求，或者是執(zhí)行基于我們程序的其他事件。
在MXML語句中向Flex控件綁定數(shù)據(jù)對(duì)象 我們可以使用數(shù)據(jù)綁定從一個(gè)Flex控件組織數(shù)據(jù)模型，或是從數(shù)據(jù)模型組織組件，或者是從一個(gè)組件向另一個(gè)組件拷貝數(shù)據(jù)。
定義自定義組件 我們可以從Flex組件類層次繼承來創(chuàng)建適合我們程序需求的組件。
下面的例子是在前一個(gè)例子的基礎(chǔ)上所做的更改，為按鈕的click事件添加事件監(jiān)聽器。一個(gè)事件監(jiān)聽器為了響應(yīng)用戶的事件而執(zhí)行的ActionScript代碼。在我們這個(gè)例子中的事件監(jiān)聽器是當(dāng)用戶選擇按鈕控件時(shí)從文本輸入控件向文本區(qū)拷貝文本：
<?xml version="1.0" encoding="utf-8"?>
<!-- ?xml tag must start in line 1 column 1 -->
<!-- MXML root element tag. -->
<mx:Application xmlns:mx="
    <!-- Flex controls exist in a container. Define a Panel container. -->
    <mx:Panel title="My Application">
        <!-- TextInput control for user input. -->
        <mx:TextInput id="myInput" width="150" text=""/>
        <!-- Output TextArea control. -->
        <mx:TextArea id="myText" text="" width="150"/>
        <!-- Button control that triggers the copy. -->
        <mx:Button id="myButton" label="Copy Text"
            click="myText.text=myInput.text;"/>
           
    </mx:Panel>
</mx:Application>
前一個(gè)例子在MXML代碼中直接插入了ActionScript代碼。雖然這對(duì)于一或是兩行的ActionScript代碼可以工作的很好，但是對(duì)于更為復(fù)雜的邏輯，通常我們會(huì)在<mx:Script>塊中定義我們的ActionScript，如下面的例子所示：
<?xml version="1.0" encoding="utf-8"?>
<!-- ?xml tag must start in line 1 column 1 -->
<!-- MXML root element tag -->
<mx:Application xmlns:mx="
    <mx:Script>
        <![CDATA[
           
            // Define an ActionScript function.
            private function duplicate():void {
                myText.text=myInput.text;
            }
        ]]>
    </mx:Script>
    <!-- Flex controls exist in a container. Define a Panel container. -->
    <mx:Panel title="My Application">
        <!-- TextInput control for user input. -->
        <mx:TextInput id="myInput" width="150" text=""/>
        <!-- Output TextArea control. -->
        <mx:TextArea id="myText" text="" width="150"/>
        <!-- Button control that triggers the copy. -->
        <mx:Button id="myButton" label="Copy Text"
            click="duplicate();"/>
           
    </mx:Panel>
</mx:Application>
在這個(gè)例子中，我們使事件監(jiān)聽器作為一個(gè)ActionScript函數(shù)來實(shí)現(xiàn)。Flex為了響應(yīng)用戶選擇按鈕控件調(diào)用這個(gè)函數(shù)。這種技術(shù)使得我們可以將我們的MXML代碼從我們的ActionScript代碼中分離出來。為了增加程序的模塊性我們也可以選擇將我們的程序分為多個(gè)文件。

使用數(shù)據(jù)綁定
Flex為了組件之間屬性的綁定，或是到數(shù)據(jù)模型的綁定提供了簡單的語法。在下面這個(gè)例子中，花括號(hào)中的值將文本區(qū)的text屬性綁定到了文本輸入控件的text屬性。當(dāng)用戶在文本輸入控件中輸入文本時(shí)，他會(huì)自動(dòng)的拷貝到文本區(qū)控件，如下面的例子所示：
<?xml version="1.0" encoding="utf-8"?>
<!-- ?xml tag must start in line 1 column 1 -->
<!-- MXML root element tag. -->
<mx:Application xmlns:mx="
    <!-- Flex controls exist in a container. Define a Panel container. -->
    <mx:Panel title="My Application">
        <!-- TextInput control for user input. -->
        <mx:TextInput id="myInput" width="150" text=""/>
        <!-- Output TextArea control. -->
        <mx:TextArea id="myText" text="{myInput.text}" width="150"/>
    </mx:Panel>
</mx:Application>
 
控制程序顯示
Flex定義我們?cè)诔绦蛑锌梢允褂玫哪J(rèn)顯示，或者是修改來定義我們特定的顯示。作為修改演示的一部分，我們可以修改下面的一些或是全部：
尺寸 一個(gè)組件或是程序的高度或是寬度。所有的組件都有一個(gè)默認(rèn)的尺寸。我們可以使用默認(rèn)的尺寸，指定我們自己的尺寸，或者作為布局我們程序的一部分讓Flex重新調(diào)整一個(gè)組件的尺寸。
格式 特性集合，例如字體，字號(hào)，文本對(duì)齊屬性，顏色。這與在層疊樣式表(CSS)定義與使用的相同。
皮膚 控制組合顯示的符號(hào)。皮膚化就是通過修改或是替換他的可視化元素來改變一個(gè)組件顯示的過程。這些元素可以圖像，SWF文件，或者是包含繪畫API方法的類文件組成。
行為 程序或是用戶行為引起的對(duì)于一個(gè)Flex組件的可見的或是可聽的變化。行為的例子如基于鼠標(biāo)移動(dòng)點(diǎn)擊的移動(dòng)或是組件尺寸的重新調(diào)整。
視圖狀態(tài) 在許多富網(wǎng)絡(luò)程序中，界面的改變基于用戶所執(zhí)行的任務(wù)。視圖狀態(tài)可以讓我們通過修改基內(nèi)容來變化一個(gè)組件的內(nèi)容和顯示或者是程序。
轉(zhuǎn)化 轉(zhuǎn)化定義了視圖狀態(tài)的改變?nèi)绾物@示在屏幕上。我們使用特效類，結(jié)合處理轉(zhuǎn)化的顯式效果設(shè)計(jì)來定義轉(zhuǎn)化。

使用數(shù)據(jù)服務(wù)工作
Flex被設(shè)計(jì)用來與可以訪問本地和遠(yuǎn)程服務(wù)端邏輯的服務(wù)進(jìn)行交互。例如，一個(gè)Flex程序可以使用AMF來連接使用簡單對(duì)象訪問協(xié)議(SOAP)的網(wǎng)絡(luò)服務(wù)，返回XML的HTTP URL，或者是Flex數(shù)據(jù)服務(wù)，與位于與Flex同一個(gè)程序服務(wù)器上的Java對(duì)象。MXML提供數(shù)據(jù)訪問的組件稱之為數(shù)據(jù)服務(wù)組件。MXML包含下列的一些數(shù)據(jù)服務(wù)組件：
WebService 提供到基于SOAP的網(wǎng)絡(luò)服務(wù)的訪問。
HTTPService 提供到返回?cái)?shù)據(jù)的HTTP URL的訪問。
RemoteObject 提供到使用AMF協(xié)議的Java對(duì)象的訪問。這個(gè)選項(xiàng)只在Flex數(shù)據(jù)服務(wù)或是Macromedia ColdFusion MX 7.0.2中可用。
在我們的Flex程序中選擇如何來訪問數(shù)據(jù)影響著我們程序的性能。因?yàn)镕lex程序是在第一次請(qǐng)求之后緩存在瀏覽器中的，當(dāng)程序運(yùn)行時(shí)，數(shù)據(jù)訪問是影響程序性能的主要原因。為了向用戶傳遞數(shù)據(jù)Flex提供了幾種解決方案。他將數(shù)據(jù)交給調(diào)用在Flex類路徑中裝入的Java類的運(yùn)行時(shí)服務(wù)，或者是向網(wǎng)絡(luò)服務(wù)或是HTTP服務(wù)器發(fā)送代理請(qǐng)求。
使用WebService組件允許我們使用基于SOAP的方法，但是他并不總是產(chǎn)生最優(yōu)的性能。同時(shí)，使用SOAP編碼的額處XML需要比AMF所做的更多的內(nèi)容。
網(wǎng)絡(luò)服務(wù)中的SOAP性能同時(shí)依賴于我們的網(wǎng)絡(luò)服務(wù)的實(shí)現(xiàn)。不同的程序服務(wù)器使用不同的網(wǎng)絡(luò)服務(wù)后端，所以我們會(huì)看到依賴于不同實(shí)現(xiàn)的性能。理解我們的實(shí)現(xiàn)表現(xiàn)如何的唯一方法就是裝入并測(cè)試我們的服務(wù)。
在許多情況下，我們的選擇依賴于我們已存在的程序以及我們?nèi)绾芜x擇將他們集成到后臺(tái)服務(wù)器資源中。網(wǎng)絡(luò)服務(wù)的表現(xiàn)在很大程度上依賴于我們的程序服務(wù)器的網(wǎng)絡(luò)服務(wù)引擎的底層實(shí)現(xiàn)，所以我們應(yīng)裝入并測(cè)試他們的性能。

將我們數(shù)據(jù)模型從我們的視圖中分離
為了清楚的分離用戶界面，程序相關(guān)的數(shù)據(jù)，數(shù)據(jù)服務(wù)，我們可以使用Flex數(shù)據(jù)模型來存儲(chǔ)控制器與數(shù)據(jù)服務(wù)之間的數(shù)據(jù)。這種三層設(shè)計(jì)是輸入數(shù)據(jù)與數(shù)據(jù)服務(wù)共同作用的結(jié)果。
當(dāng)我們計(jì)劃一個(gè)程序，我們要決定程序必須存儲(chǔ)的數(shù)據(jù)類型以及這些數(shù)據(jù)要如何處理。這有助于我們決定我們需要什么類型的數(shù)據(jù)模型。例如，假設(shè)我們決定我們的程序必須存儲(chǔ)顧員的相關(guān)數(shù)據(jù)。一個(gè)簡單的顧員模型可能包含姓名，部門以及郵箱地址屬性。
一個(gè)Flex數(shù)據(jù)模型是一個(gè)包含我們用來存儲(chǔ)程序相關(guān)數(shù)據(jù)的屬性的ActionScript對(duì)象。我們可以將數(shù)據(jù)模型用于數(shù)據(jù)驗(yàn)證，從而他可以包含客戶端業(yè)務(wù)邏輯。我們可以在MXML或是ActionScript中定義一個(gè)數(shù)據(jù)模型。在MVC設(shè)計(jì)模式中，數(shù)據(jù)模型代表模型層。
我們可以在MXML標(biāo)簽，ActionScript函數(shù)或是ActionScript類中定義數(shù)據(jù)模型。在MXML中編寫的模型用利于快速開發(fā)與簡化數(shù)據(jù)存儲(chǔ)，但是他不能提供任何額外的功能，而我們不可以設(shè)定模型屬性的數(shù)據(jù)類型。如果我們想要設(shè)定數(shù)據(jù)類型以及為額外的功能提供方法，我們應(yīng)使用基于ActionScript的類。在通常情況下，我們應(yīng)為了簡化數(shù)據(jù)結(jié)構(gòu)使用基于MXML的模型，為更為復(fù)雜的結(jié)構(gòu)以及客戶端業(yè)務(wù)邏輯使用ActionScript。

    本站是提供個(gè)人知識(shí)管理的網(wǎng)絡(luò)存儲(chǔ)空間，所有內(nèi)容均由用戶發(fā)布，不代表本站觀點(diǎn)。請(qǐng)注意甄別內(nèi)容中的聯(lián)系方式、誘導(dǎo)購買等信息，謹(jǐn)防詐騙。如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容，請(qǐng)點(diǎn)擊一鍵舉報(bào)。
    轉(zhuǎn)藏 分享 獻(xiàn)花（0）

    0條評(píng)論

    發(fā)表

    請(qǐng)遵守用戶 評(píng)論公約

    類似文章 更多