Share on Google+Share on Google+

Global style in Flex4

Advertisement
You can set the style using global selector. It set the same style property foe all components in the application.

Global style in Flex4:

You can set the style using global selector. It set the same style property foe all components in the application. You can use the setStyle() method for set the style globally for all components. In this example you can see how we can use global style using simple way and setStyle() method.

Example:

<?xml version="1.0" encoding="utf-8"?>

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

xmlns:s="library://ns.adobe.com/flex/spark"

xmlns:mx="library://ns.adobe.com/flex/mx"

minWidth="955" minHeight="600" creationComplete="init(event)">

<!-- Global Style -->

<fx:Style>

@namespace s "library://ns.adobe.com/flex/spark";

@namespace mx "library://ns.adobe.com/flex/mx";

global{

font-family:"Verdana";

font-weight:bold;

button-height:50px;

button-width:100px;

color:#003366;

text-decoration:underline;

chrome-color:#7578ef;

}

</fx:Style>

<fx:Script><![CDATA[

public function init(e:Event):void {

// Global Style using styleManager

styleManager.getStyleDeclaration("global").setStyle("fontSize", 12);

styleManager.getStyleDeclaration("global").setStyle("color", 0x003366);

}

]]>&</fx:Script>

<s:Panel title="Global Style Example/font>" width="337" height="156">

<s:Button x="130" y="27" label="Button"/>

<s:Label x="63" y="78" text="This is a Global style example"/>

</s:Panel>

</s:Application>

Output:

Running Application:

To view this page ensure that Adobe Flash Player version 10.0.0 or greater is installed.

Download this code

Advertisements

Posted on: June 22, 2010 If you enjoyed this post then why not add us on Google+? Add us to your Circles

Share this Tutorial Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.