在flex4新增加了乙個包:spark.skins,這個包裡面只有乙個類:sparkskin,而我們(非美工的程式設計師)通過這個class來實現任意自定義控制項的樣式。
通過上述關係可以得出如下的結論:
1、sparkskin是乙個group型別的容器。(它繼承與group)
2、是全部spark類的基礎類,也就說全部的mx.spark的視覺化控制項的外觀全部都是sparkskin的子類)
注意skin,這個類是sparkskin的父類,同時skin繼承與group。
skin:
是sparkskin的父類,例如buttonbarskin就是skin的子類,如果想要自定義這部分元件的樣式,則需要使用skin。
sparkskin:
是全部spark類的基礎類,也就說全部的mx.spark的視覺化控制項的外觀全部都是sparkskin的子類。
綜上所述,用sparkskin和skin都可達到同樣的效果。
在flex4中,我們只需要將這個button的樣式繼承與sparkskin或者skin,然後在其中加入一些想要的內容即可,請看以下**:
<?xml version="1.0" encoding="utf-8"?>
[hostcomponent("spark.components.button")]
我們可以用以下幾個方式將這個樣式應用:
1、button
2、mybutton.setstyle( "skinclass", class(cn.xuedi.selfbutton));
3、其中skinclass也是flex4裡面新增加的乙個類,其作用就是設定當前這個元件的skin。
以上**解釋:
1、含義:
如果要自定義控制項樣式,必須要要繼承sparkskin或者skin。
2、[hostcomponent("spark.components.button")]>
含義:我們要修改的是spark.components.button的外形,flex4新增了乙個matadata tag:hostcomponent
同時,metadata也由原來的mx:變成了現在的fx,因為命名空間發生了改變。
3、含義:
定義了button的四種狀態:up、down、over、disabled。這是flex4新增的一種功能,用state來描述狀態。
在flex3的情況下,只能描述ui的不同狀態,而在flex4中,又賦予了state描述控制項狀態的功能。
4、含義:
畫乙個圓形(橢圓形)的圖形,而ellipse也是flex4新增乙個包:spark.primitives裡面的乙個類。
spark.primitives裡面定義了一些圖形,例如:ellipse、rect、path、line等類。同樣根據這些類名就可以得出是做什麼用的。
5、含義:
設定填充的方式(solidcolor)填充顏色值ffff00的顏色,color.over是指滑鼠移動上去後的顏色,color.down是滑鼠按下時候的顏色。
引申一下,還有color.up、color.display,通過這些值就可以描述四種狀態時的顏色。
注意:solidcolor外層必須要有否則會出現錯誤。fill是填充的意思。
6、含義:
設定邊線的顏色(solidcolorstroke)當然也可以設定諸如:color.up、color.display、color.down、color.over的顏色。
同樣solidcolorstroke必須在stroke內部,而stroke的含義:設定邊框。
7、我們在重新看一下這些**的意義:
含義:定義乙個圓形(因為寬和高相等)然後填充乙個0xffff00的顏色,並且設定滑鼠移上、按下時的顏色值(color.over="#00ff00" color.down="#ff0000")
然後在定義乙個邊框,設定顏色為0x0c0d0d。
8、含義:
上面的**定義了button中可以顯示文字的部分。注意,id必須設定為labelelement,否則出錯。其他的樣式可以自行設定了。
主程式:
我們要注意的地方:skinclass,這也是flex4新增加的乙個類,專門用來設定當前**的properties,請注意skinclass只適用於spark包裡面的視覺化控制項。
以上就是通過繼承sparkskin、skin和skinclass的方式很簡單的實現自定義元件的**。
FLEX4實踐 自定義控制項面板
設計需求 1 對於介面上的textinput控制項,需要設定 必填 與 非必填 兩種狀態 2 對於 必填 狀態希望給與控制項特殊的顯示樣式 3 希望能簡化 不需要每次使用textinput控制項都要對其置樣式 方案1 將樣式控制寫入css檔案,通過style屬性控制textinput的顯示 方案2 ...
Flex4 自定義事件
1.方式一 通過繼承event類編寫flex4的自定義事件 下面我們來做乙個例子,實現這樣的功能 監控textinput的輸入,通過監控輸入的內容,觸發不同的自定義事件。我們先來寫這個自定義事件 actionscript類test43event.cs packagedemo importflash....
Flex4自定義事件
1 自定義事件 2 自定義帶引數的事件 剛到公司上班沒多久,事情不是太多。打醬油的成分佔據大多時間。閒著沒事學習下flex。在這之前沒有接觸過flex。在理解上面多有拙劣之處。重在交流,總結。還望看到的各位高手能夠給予指點。剛做了乙個自定義事件,對於我們初學flex的並且沒有人交流的還是有點難度的。...