Flex Style Property


 

Flex Style Property

In this tutorial we have illustrate how to use Style with flex component and implement with example that show process of use local style in application

In this tutorial we have illustrate how to use Style with flex component and implement with example that show process of use local style in application

Style in Flex:-

Style is the main part of the Flex because user can change the look or modify the appearance of the flex component. Basically it is a property and user can use that property many ways. In this tutorial you can see a way to use Style for flex component. You can see how to use local style in flex. User can implement Style property in own application by using <mx:Style>tag  and set selector name and style property value. you can also use external style sheet i will discuss later. This is example of local style in flex.

Example:-

<?xml version="1.0"?>

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

<mx:Style>

.myStyle {

fontSize: 20;

color: #0000FF;

font-family:itelic;

font-weight:bold;

}

Button {

fontSize: 20;

color: #0000FF;

font-family:itelic;

font-weight:bold;

}

</mx:Style>

<mx:Panel width="250" height="250" title="Local Style Examlpe">

<mx:Text text="Hello Style" styleName="myStyle"/>

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

<mx:LinkButton label="This is my Link Button" styleName="myStyle"/>

</mx:Panel>

</mx:Application>

In this tutorial we have implement a local style for  Text, Button And Link Button controls in flex. In this tutorial there are two way for implements style, one is use style name property of the component like Text and Link Button  and other is direct to component like Button . In this example user can set style locally and use that.

Output:-

Ads