Flex External Style sheet uses


 

Flex External Style sheet uses

In this tutorial you can see how to use external style sheet in your application.

In this tutorial you can see how to use external style sheet in your application.

Flex Style with External Style Sheet:-

In this tutorial you can see how to use External Style Sheet inn your flex application. Firstly we have create Style in different CSS file. you can use that style sheet directly in flex application by using <mx:style> tag and set the source property that hold location of the CSS file. The CSS file is like,

/* CSS file */

Text

{

color: #456B68;

fontStyle: italic;

fontSize: 14;

fontSharpness: 20;

fontWeight: bold;

fontFamily: "Times New Romen";

paddingLeft: 10;

paddingRight: 10;

paddingTop: 10;

paddingBottom: 10;

leading: 1;

}

Button

{

color: #456B68;

fontStyle: italic;

fontSize: 14;

fontWeight: bold;

fontFamily: "Times New Romen";

}

This CSS have two component Style one is Text and other is Button component. After that we have use this style sheet like this.

Example:-

<?xml version="1.0"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="horizontal">

<mx:Style source="Style.css"/>

0

<mx:Panel width="300" height="300" title="External Style Example">

<mx:Text text="Hello Flex Style"/>

<mx:Button label="This is Button Style"/>

1

</mx:Panel>

</mx:Application>

 This is the process to use External Style sheet in flex application.

2

Output:-

Ads