建站
咨詢
售后
建站咨詢
新聞中心
flex4 beta發(fā)布了，它是自flex3以來的重大改革。flex4 beta 提供了一種新的組件和皮膚的架構(gòu)。作為一個flex3的開發(fā)者，當(dāng)你用flex4 beta編譯你的flex3應(yīng)用時你應(yīng)該不會遇到太大的挑戰(zhàn)，因為flex4 beta的一個目標(biāo)就是保持與flex3的兼容。
我們提供的服務(wù)有：成都網(wǎng)站建設(shè)、成都網(wǎng)站制作、微信公眾號開發(fā)、網(wǎng)站優(yōu)化、網(wǎng)站認(rèn)證、句容ssl等。為近千家企事業(yè)單位解決了網(wǎng)站和推廣的問題。提供周到的售前咨詢和貼心的售后服務(wù)，是有科學(xué)管理、有技術(shù)的句容網(wǎng)站制作公司
在這篇文章里我會提供關(guān)于flex4 beta主體帶的一個大概的瀏覽，介紹一下Flex3到Flex4架構(gòu)上的區(qū)別，以及在組件，布局，狀態(tài)，效果上的改變。這篇文章里，halo代表flex3里的原始組件。spark代表flex4 beta里的新的組件。
將應(yīng)用遷移到flex4 beta
把應(yīng)用從flex3遷移到flex4，不會遇到太大的麻煩。除了看到一些bug被修補了以及默認(rèn)的主題換了，你還會看到你的應(yīng)用會在flex4里工作的更好。但是還是有些東西你需要注意。
◆播放器的依賴
flex4 beta 需要flash player10的支持。
◆樣式選擇器需要命名空間
對于一個css樣式選擇器以前你可能只需要這樣寫
- Button {
- cornerRadius: 10;
- }
- DateField {
- color: #780800; }
但是在flex4 beta里你必須加上命名空間。
- < mx:Style>
- @namespace "http://www.adobe.com/2006/mxml";
- …
- < /mx:Style>
更進(jìn)一步，如果你用了StyleManager.getStyleDeclaration("Button")，在flex4里你必須把命名空間給加上 如：StyleManager.getStyleDeclaration("mx.controls.Button")。
◆Flex3到Flex4主題的變化
主題已經(jīng)由默認(rèn)的halo變成了spark。所以你的應(yīng)用在flex4里看起來可能會不一樣了。當(dāng)然了，你要是想用halo也是有辦法的。你可以用-compatibility-version=3.0這個標(biāo)識也可以修改additional compiler argument（附加的編譯器自變量）為_local en US -theme=halo.swc。
如果你選擇用Spark，你會發(fā)現(xiàn)很多在Halo里工作的樣式到Spark里就不工作了，spark主題只支持有限的樣式。想要修改如border之類的外觀你需要自定義的皮膚。flex4也提供了一個Wireframe皮膚來幫助你快速建立模型。
除了默認(rèn)樣式的變化，預(yù)加載進(jìn)度條也變化了。這個更輕量級的進(jìn)度條會縮短啟動的時間。你要想還是用原來的加載進(jìn)度條你只需加上下面這一條：preloader="mx.preloaders.DownloadProgressBar"。
Flex3到flex4 beta架構(gòu)改變一覽
flex4 給設(shè)計師和開發(fā)者提供一個更平滑的工作流。為了實現(xiàn)這個，flex4框架提供了可視化組件和其行為的明確的分界。 在flex3里一個組件代碼包括邏輯，布局和可視化的變化，但是在flex4里一個組件被分配到了不同的類，每個類都掌控不同的方面。
◆flex4里的包和命名空間
flex4里保存了flex3的全部類，它們?nèi)趍x.*的包里。當(dāng)然除此之外，flex還提供全新的spark.*包來保存組件，核心類，效果，濾鏡，布局， 皮膚和工具。
flex提供了一套組件，其中很多與halo有同樣的名字，為了避免名字的沖突，隨flex4而來的是4個不同的命名空間：MXML 2006, MXML 2009, Spark, and Halo。
MXML 2006:過時的mxml語言命名空間，曾用在flex3。如果用flex4編譯flex3的應(yīng)用程序，你依然可以用這個命名空間。
URI: http://www.adobe.com/2006/mxml
默認(rèn)前綴：mx
MXML 2009: 全新的mxml語言命名空間，是純的語言命名空間，不包含組件。
URI: http://ns.adobe.com/mxml/2009
默認(rèn)前綴：fx
SPARK:這個命名空間里包含了所有的新的Spark組件，他應(yīng)該和MXML 2009一起使用。
URI: library://ns.adobe.com/flex/spark
默認(rèn)前綴: s
HALO:這個命名空間包含所有halo的組件，應(yīng)該與MXML2009一起使用。
URI: library://ns.adobe.com/flex/halo
默認(rèn)前綴：mx
flex4在css方面也提供了多樣的命名空間的支持。所以，在使用css時必須注意命名空間已避免沖突。
- < fx:Style>
- @namespace s "library://ns.adobe.com/flex/spark";
- @namespace mx "library://ns.adobe.com/flex/halo";
- s|Button {
- color: #FF0000;
- }
- mx|DateChooser {
- color: #FF0000;
- }
- < /fx:Style>
新的組件和容器
◆組件
flex4修改和新增了一些組件，也有些組件是halo有的,但是spark沒有。adobe建議你halo和spark一起用。至于兩者都有什么，沒什么下面有個網(wǎng)址你可以去看看。
http://www.adobe.com/devnet/flex/articles/flex3and4_differences_04.html
◆state語法的改變
state語法變了，變得更加的有彈性和直接。你甚至可以根據(jù)上下文來針對性的改變你的狀態(tài)。下面是重點：
1，只有狀態(tài)被定義到了狀態(tài)數(shù)組。
2，AddChild和RemoveChild，不能再用了。取而代之的是includeIn和excludeFrme屬性 。這兩個屬性是組件的屬性。
看例子吧！
這是flex3應(yīng)用狀態(tài)的方式。
- < mx:states>< mx:State name="submitState" basedOn="">
- < mx:AddChild relativeTo="{loginForm}" >
- < mx:Button label="submit" bottom="10" right="10"/>
- < /mx:AddChild>
- < mx:RemoveChild target="{firstTextInput}"/>
- < /mx:State>
- < /mx:states>
- < mx:TextInput id="firstTextInput" />
- < mx:Canvas id="loginForm" />
這是flex4
- < s:states>
- < s:State name="submitState" />
- < /s:states>
- < s:TextInput id="firstTextInput" excludeFrom="submitState" />
- < s:Group id="loginForm" >
- < s:Button label="submit" bottom="10" right="10" includeIn="submitState"/> < /s:Group>
3,setProperty,setStyle和setEvent被點語法取代了。
下面是flex3的做法
- < mx:states>
- < mx:State name="submitState" basedOn="">
- < mx:SetProperty target="{submitButton}" name="label" value="submit" />
- < mx:SetStyle target="{submitButton}" name="textDecoration" value="underline"/>
- < mx:SetEventHandler target="{submitButton}" name="click" handler="trace('done');"/>
- < /mx:State>
- < mx:State name="clearState" basedOn="">
- < mx:SetProperty target="{submitButton}" name="label" value="clear" />
- < mx:SetEventHandler target="{submitButton}" name="click" handler="emptyDocument()" />
- < /mx:State>
- < /mx:states>
- < mx:Button id="submitButton" />
下面是flex4的做法
- < s:states>
- < s:State name="submitState" />
- < s:State name="clearState" />
- < /s:states>
- < s:Button label.submitState="submit" textDecoration.submitState="underline"
- click.submitState="trace('done')" click.clearState="emptyDocument()" label.clearState="clear" textDecoration.clearState="none"/>
4,組件不能在無狀態(tài)或空的狀態(tài)。它默認(rèn)的狀態(tài)時第一個聲明的狀態(tài)。
flex4 beta還有其他的特性，以后的文章繼續(xù)在討論。
adobe官方說從flex3到flex4得轉(zhuǎn)變painless。你認(rèn)為呢？
【編輯推薦】
- Flex教程 Flex程序開發(fā)初步
- Flex垃圾回收和性能優(yōu)化的一些總結(jié)
- Flex和Jsp之間中文參數(shù)的傳遞
- Flex編程中需要注意的Namespace用法
- Flex SDK 4：Gumbo的主題 極其快速的RIA開發(fā)
網(wǎng)站標(biāo)題：從Flex3到Flex4的轉(zhuǎn)變一覽
URL標(biāo)題：http://www.dlmjj.cn/article/cdjcoig.html
