国产一级a片免费看高清,亚洲熟女中文字幕在线视频,黄三级高清在线播放,免费黄色视频在线看

打開APP
userphoto
未登錄

開通VIP,暢享免費(fèi)電子書等14項(xiàng)超值服

開通VIP
Flex4相對(duì)于Flex3的變化 - 唐@朝 - JavaEye技術(shù)網(wǎng)站

Flex4相對(duì)于Flex3的變化

以下內(nèi)容轉(zhuǎn)載自互聯(lián)網(wǎng),如侵犯您的權(quán)利,請(qǐng)來(lái)信告知!

 

      flex4 beta發(fā)布了,它是自flex3以來(lái)的重大改革。flex4 beta 提供了一種新的組件和皮膚的架構(gòu)。作為一個(gè)flex3的開發(fā)者,當(dāng)你用flex4 beta編譯你的flex3應(yīng)用時(shí)你應(yīng)該不會(huì)遇到太大的挑戰(zhàn),因?yàn)閒lex4 beta的一個(gè)目標(biāo)就是保持與flex3的兼容。

      在這篇文章里我會(huì)提供關(guān)于flex4 beta主體帶的一個(gè)大概的瀏覽,介紹一下Flex3到Flex4架構(gòu)上的區(qū)別,以及在組件,布局,狀態(tài),效果上的改變。這篇文章里,halo代表flex3里的原始組件。spark代表flex4 beta里的新的組件。

 

將應(yīng)用遷移到flex4 beta

      把應(yīng)用從flex3遷移到flex4,不會(huì)遇到太大的麻煩。除了看到一些bug被修補(bǔ)了以及默認(rèn)的主題換了,你還會(huì)看到你的應(yīng)用會(huì)在flex4里工作的更好。但是還是有些東西你需要注意。

      ◆播放器的依賴

      flex4 beta 需要flash player10的支持。

      ◆樣式選擇器需要命名空間

      對(duì)于一個(gè)css樣式選擇器以前你可能只需要這樣寫

     

Html代碼
  1. Button {     
  2.       cornerRadius: 10;     
  3. }     
  4. DateField {     
  5.       color: #780800;    
  6. }   

 

     但是在flex4 beta里你必須加上命名空間。

    

Java代碼
  1. < mx:Style>   
  2.       @namespace "http://www.adobe.com/2006/mxml";     
  3.       …     
  4. < /mx:Style>   

 

 

    更進(jìn)一步,如果你用了StyleManager.getStyleDeclaration("Button"),在flex4里你必須把命名空間給加上  如:StyleManager.getStyleDeclaration("mx.controls.Button")。

   

    ◆Flex3到Flex4主題的變化

     主題已經(jīng)由默認(rèn)的halo變成了spark。所以你的應(yīng)用在flex4里看起來(lái)可能會(huì)不一樣了。當(dāng)然了,你要是想用halo也是有辦法的。你可以用-compatibility-version=3.0這個(gè)標(biāo)識(shí)也可以修改additional compiler argument(附加的編譯器自變量)為_local en US -theme=halo.swc。

      如果你選擇用Spark,你會(huì)發(fā)現(xiàn)很多在Halo里工作的樣式到Spark里就不工作了,spark主題只支持有限的樣式。想要修改如border之類的外觀你需要自定義的皮膚。flex4也提供了一個(gè)Wireframe皮膚來(lái)幫助你快速建立模型。

      除了默認(rèn)樣式的變化,預(yù)加載進(jìn)度條也變化了。這個(gè)更輕量級(jí)的進(jìn)度條會(huì)縮短啟動(dòng)的時(shí)間。你要想還是用原來(lái)的加載進(jìn)度條你只需加上下面這一條:preloader="mx.preloaders.DownloadProgressBar"。

   

Flex3到flex4 beta架構(gòu)改變一覽

      flex4 給設(shè)計(jì)師和開發(fā)者提供一個(gè)更平滑的工作流。為了實(shí)現(xiàn)這個(gè),flex4框架提供了可視化組件和其行為的明確的分界。 在flex3里一個(gè)組件代碼包括邏輯,布局和可視化的變化,但是在flex4里一個(gè)組件被分配到了不同的類,每個(gè)類都掌控不同的方面。

      ◆flex4里的包和命名空間

      flex4里保存了flex3的全部類,它們?nèi)趍x.*的包里。當(dāng)然除此之外,flex還提供全新的spark.*包來(lái)保存組件,核心類,效果,濾鏡,布局, 皮膚和工具。

      flex提供了一套組件,其中很多與halo有同樣的名字,為了避免名字的沖突,隨flex4而來(lái)的是4個(gè)不同的命名空間:MXML 2006, MXML 2009, Spark, and Halo。

      MXML 2006:過時(shí)的mxml語(yǔ)言命名空間,曾用在flex3。如果用flex4編譯flex3的應(yīng)用程序,你依然可以用這個(gè)命名空間。

      URI: http://www.adobe.com/2006/mxml

      默認(rèn)前綴:mx

      MXML 2009: 全新的mxml語(yǔ)言命名空間,是純的語(yǔ)言命名空間,不包含組件。

      URI: http://ns.adobe.com/mxml/2009

      默認(rèn)前綴:fx

      SPARK:這個(gè)命名空間里包含了所有的新的Spark組件,他應(yīng)該和MXML 2009一起使用。

      URI: library://ns.adobe.com/flex/spark

      默認(rèn)前綴: s

      HALO:這個(gè)命名空間包含所有halo的組件,應(yīng)該與MXML2009一起使用。

      URI: library://ns.adobe.com/flex/halo

      默認(rèn)前綴:mx

      flex4在css方面也提供了多樣的命名空間的支持。所以,在使用css時(shí)必須注意命名空間已避免沖突。

  1.  < fx:Style> 
  2. @namespace s "library://ns.adobe.com/flex/spark";  
  3. @namespace mx "library://ns.adobe.com/flex/halo";  
  4. s|Button {  
  5. color: #FF0000;  
  6. }  
  7. mx|DateChooser {  
  8. color: #FF0000;  
  9. }  
  10.  < /fx:Style> 

新的組件和容器

◆組件

flex4修改和新增了一些組件,也有些組件是halo有的,但是spark沒有。adobe建議你halo和spark一起用。至于兩者都有什么,沒什么下面有個(gè)網(wǎng)址你可以去看看。

http://www.adobe.com/devnet/flex/articles/flex3and4_differences_04.html

◆state語(yǔ)法的改變

state語(yǔ)法變了,變得更加的有彈性和直接。你甚至可以根據(jù)上下文來(lái)針對(duì)性的改變你的狀態(tài)。下面是重點(diǎn):

1,只有狀態(tài)被定義到了狀態(tài)數(shù)組。

2,AddChild和RemoveChild,不能再用了。取而代之的是includeIn和excludeFrme屬性 。這兩個(gè)屬性是組件的屬性。

看例子吧!

這是flex3應(yīng)用狀態(tài)的方式。

  1.  < mx:states>< mx:State name="submitState" basedOn=""> 
  2. < mx:AddChild relativeTo="{loginForm}" > 
  3. < mx:Button label="submit" bottom="10" right="10"/> 
  4. < /mx:AddChild> 
  5. < mx:RemoveChild target="{firstTextInput}"/> 
  6. < /mx:State> 
  7. < /mx:states> 
  8. < mx:TextInput id="firstTextInput" /> 
  9. < mx:Canvas id="loginForm" /> 

這是flex4

  1.  < s:states> 
  2. < s:State name="submitState" /> 
  3. < /s:states> 
  4. < s:TextInput id="firstTextInput" excludeFrom="submitState" /> 
  5. < s:Group id="loginForm" > 
  6. < s:Button label="submit" bottom="10" right="10" includeIn="submitState"/> < /s:Group> 

3,setProperty,setStyle和setEvent被點(diǎn)語(yǔ)法取代了。

下面是flex3的做法

  1.  < mx:states> 
  2. < mx:State name="submitState" basedOn=""> 
  3. < mx:SetProperty target="{submitButton}" name="label" value="submit" /> 
  4. < mx:SetStyle target="{submitButton}" name="textDecoration" value="underline"/> 
  5. < mx:SetEventHandler target="{submitButton}" name="click" handler="trace('done');"/> 
  6. < /mx:State> 
  7. < mx:State name="clearState" basedOn=""> 
  8. < mx:SetProperty target="{submitButton}" name="label" value="clear" /> 
  9. < mx:SetEventHandler target="{submitButton}" name="click" handler="emptyDocument()" /> 
  10. < /mx:State> 
  11. < /mx:states> 
  12.  < mx:Button id="submitButton" /> 

下面是flex4的做法

  1.  < s:states> 
  2. < s:State name="submitState" /> 
  3. < s:State name="clearState" /> 
  4. < /s:states> 
  5. < s:Button label.submitState="submit" textDecoration.submitState="underline" 
  6. click.submitState="trace('done')" click.clearState="emptyDocument()" label.clearState="clear" textDecoration.clearState="none"/> 

4,組件不能在無(wú)狀態(tài)或空的狀態(tài)。它默認(rèn)的狀態(tài)時(shí)第一個(gè)聲明的狀態(tài)。

flex4 beta還有其他的特性,以后的文章繼續(xù)在討論。

adobe官方說(shuō)從flex3到flex4得轉(zhuǎn)變painless。你認(rèn)為呢?

 

Flex4相對(duì)FLex3的組件變化

customizations much more straightforward. Here is a table showing Flex 3 Halo components and their Flex 4 beta Spark counterparts:

Flex 3 Halo Component Flex 4 beta Spark Component
mx.controls.Button spark.components.Button
mx.controls.ButtonBar spark.components.ButtonBar
mx.controls.CheckBox spark.components.CheckBox
mx.controls.ComboBox spark.components.DropDownList (w/o editability)
mx.controls.HorizontalList spark.components.List (with a HorizontalLayout)
mx.controls.HRule spark.primitives.Line
mx.controls.HScrollBar spark.components.HScrollBar
mx.controls.HSlider spark.components.HSlider
mx.controls.Image spark.primitives.BitmapImage
mx.controls.LinkBar spark.components.ButtonBar (with a custom skin)
mx.controls.LinkButton spark.components.Button (with a custom skin)
mx.controls.List spark.components.List
mx.controls.NumericStepper spark.components.NumericStepper
mx.controls.RadioButton spark.components.RadioButton
mx.controls.RadioButtonGroup spark.components.RadioButtonGroup
mx.controls.TextArea spark.components.TextArea
mx.controls.TextInput spark.components.TextInput
mx.controls.TileList spark.components.List (with a TileLayout)
mx.controls.ToggleButtonBar spark.components.ButtonBar
mx.controls.VideoDisplay spark.components.VideoPlayer
mx.controls.VRule spark.primitives.Line
mx.controls.VScrollBar spark.components.VScrollBar
mx.controls.VSlider

spark.components.VSlider

mx.core.Application spark.components.Application
mx.core.Window spark.components.Window
mx.core.WindowedApplication spark.components.WindowedApplication
mx.containers.Canvas spark.components.Group
mx.containers.HBox spark.components.HGroup
mx.containers.Panel spark.components.Panel
mx.containers.Tile spark.components.Group (with a TileLayout)
mx.containers.VBox spark.components.VGroup

Adobe encourages you to use Halo components and containers along with Spark components. Because Adobe continues to build components atop the same base class (UIComponent), there should be full interoperability between Spark and Halo. Here is a table of the components and containers that do not currently have direct Spark equivalent classes.

Flex 3 classes with no direct Flex 4 beta counterpart
mx.controls.Alert
mx.controls.ColorPicker
mx.controls.DataGrid
mx.controls.DateChooser
mx.controls.DateField
mx.controls.Menu
mx.controls.MenuBar
mx.controls.PopUpButton
mx.controls.PopUpMenuButton
mx.controls.ProgressBar
mx.controls.RichTextEditor
mx.controls.TabBar
mx.controls.Tree
mx.containers.Accordion
mx.containers.ApplicationControlBar
mx.containers.ControlBar
mx.containers.DividedBox
mx.containers.Form
mx.containers.Grid
mx.containers.TabNavigator
mx.containers.TitleWindow
mx.containers.ViewStack

Changes in states syntax

Flex 4 beta has promoted the states functionality to a full MXML language feature. As a result, you will likely find states to be much more flexible and direct. The new states syntax is more inline, allowing state-specific changes to be specified in context. Here are the key differences in the Flex 4 beta syntax:

  • Only states are defined within the states array.
  • In the new states syntax, you cannot use de>AddChildde> and de>RemoveChildde>. Instead, you define a component's role in a particular state on the component itself using the de>includeInde> and de>excludeFromde> attributes.

In the following Flex 3 example, states are used to include a Button and remove a TextInput only when the de>currentStatede> of the document is de>submitStatede>. This approach can get very verbose with more complex states.

<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" />

Here is the simpler Flex 4 beta code using de>includeInde> and de>excludeFromde>.

<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>
  • de>SetPropertyde>, de>SetStylede>, and de>SetEventHandlerde> have been replaced by a new dot syntax, which allows you to qualify MXML attribute values with a specific state identifier.

In the following Flex 3 example, the code defines a property, style, and event for a Button in de>submitStatede>.

<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" />de><mx:SetEventHandler target="{submitButton}" name="click" de>handler="emptyDocument()" /></mx:State></mx:states><mx:Button id="submitButton" />

In Flex 4 beta, the code looks like this:

<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"/>
  • A component can no longer be in an undefined or null state. By default, the first declared state is the initial state of a component.
    The new syntax is available when a document uses the MXML 2009 language namespace. You cannot mix the legacy syntax and the new states syntax. The old syntax is available only in the MXML 2006 namespace.

Additionally, each component now supports a set of states defined in its skin class, which makes it simpler to apply visual changes depending on the state of a component. For example, if you look at the skin for the Spark Button, you will find the following states defined:

<s:states><s:State name="up" /><s:State name="over" /><s:State name="down" /><s:State name="disabled" /></s:states>

The ButtonSkin class defines what happens visually to a Spark Button in each one of these states.

This is only a brief introduction to the new Flex 4 beta states syntax. Visit the Enhanced States Syntax Spec to find more details.

 

本站僅提供存儲(chǔ)服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請(qǐng)點(diǎn)擊舉報(bào)。
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
在allegro中如何對(duì)齊元件
The Flex Programming Model
PureMVC的十個(gè)小提示 - 百草園 - JavaEye技術(shù)網(wǎng)站
jLayout — JavaScript Layout Algorithms
連通組件 · spark
flex4 讀書筆記 chapter 1
更多類似文章 >>
生活服務(wù)
分享 收藏 導(dǎo)長(zhǎng)圖 關(guān)注 下載文章
綁定賬號(hào)成功
后續(xù)可登錄賬號(hào)暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點(diǎn)擊這里聯(lián)系客服!

聯(lián)系客服