Stílus objektum deklarálása
A CSSStyleDeclaration az ActionScript egy objektuma, amelynek segítségével CSS stílusváltozók hozhatók létre, és rendelhetők különböző komponensekhez.
Az alábbi példa kék színűre írja át az összes CheckBox feliratának színét.
var myst=new mx.styles.CSSStyleDeclaration()
myst.color=0x0000ff
_global.styles. CheckBox =myst
A CSS (Cascading Style Sheet), vagy stíluslap a W3C, a HTML formázási hiányosságainak kiküszöbölésére kifejlesztett szabványa. A CSS számos tulajdonságot, és a tulajdonság által felvehető értéket definiál. A HTML dokumentum tagjeihez az így kialakított stílusok három szinten rendelhetők hozzá.
- A tag STYLE paraméterének értékeként.
- A HTML dokumentum STYLE tagjánek használatával.
- Külső stíluslapként a LINK taggel csatolva az adott HTML dokumentumhoz.
SetStyle, getStyle, clearStyle metódusok
A új stílus létrehozásához szükségünk van egy CSSStyleDeclaration típusú változóra.
var myst=new mx.styles.CSSStyleDeclaration()
Miután létrehoztuk a változót használhatjuk a CSSStyleDeclaration objektum számos tulajdonságát, és metódusát, amelyekkel CSS stílusok hozhatók létre.
Összetevők stílusa
A CSSStyleDeclaration típusú változó stílustulajdonságainak beállítása után, a változót egyszerűen hozzárendelhetjük valamelyik komponens stíluslapjához.
Az alábbi kód összekapcsolja a myst változót a Button komponens stíluslapjával.
Így az összes Button típusú komponens felirata narancssárga színű lesz.
myst.color=0xFFCC00
_global.styles.Button=myst
Példányok stílusának változtatása
A komponensek egyes típusainak stílusát együttesen szabályozhatjuk a CSSStyleDeclaration objektummal. Arra is van azonban lehetőségünk, hogy az egyes objektumpéldányok stílustulajdonságait külön-külön állítsuk be. Ehhez ismernünk kell a megfelelő komponens példánynevét.
A stílus megváltoztatásához a setStyle metódus kell használni, amelynek első paramétere a tulajdonság neve, második pedig annak értéke.
Az következő sor a my_btn nevű komponenspéldány szövegszínét pirosra állítja.
my_btn.setStyle("color","0xff0000")
Egy komponenstípus stílusának szabályozása
A példányok tulajdonságait szabályzó setStyle metódus alkalmazható egy speciális objektumra, amely a _global nevet viseli.
Az alábbi sor minden komponens betűszínét átírja
_global.setStyle("color","0x00ff00")
Minden komponens stílusának szabályozása
Amikor minden komponens stílusát formázzuk, tudnunk kell, hogy nem minden komponens támogat minden tulajdonságot.
A nyomógombokon például beállítható a color tulajdonság, de nem szabályozható a backgroundColor. A TextArea komponens azonban mindkét tulajdonság beállítást lehetővé teszi.
Témák használata
A komponensek gyakran viselnek magukon egy bizonyos színtémát, amely több állapotukban is megjelenik. Példa erre a Button komponens, amely körül rámutatáskor színes keret jelenik meg, kattintáskor pedig a keret színének megfelelő háttérszín lesz látható a gombon.
Ezeket a színeket egy speciális stílussal szabályozhatjuk, amely a themeColor nevet viseli. A stílust értékét a setStyle metódussal adhatjuk meg. Az érték lehet hexadecimális színkód, vagy három beépített színnév (haloGreen, haloBlue, haloOrange) valamelyike.
Amennyiben létezik my_btn példánynevű komponensünk, az alábbi sor piros színűre állítja színtámáját:
my_btn.setStyle("themeColor",0xff0000)