Home Tutorial Flex Flex4 Components Spark BorderContainer Properties in Flex4

 
 

Spark BorderContainer Properties in Flex4
Posted on: April 24, 2010 at 12:00 AM
BorderContainer container define two properties, one is backgroundFill and other is borderStroke property. The backgroundFill property is IFill type. If user define this property then container dismiss the style properties like backgroundAlpha, backgroundColor, backgroundImage etc.

Spark BorderContainer Properties in flex4:

Spark BorderContainer  define two properties, one is backgroundFill and other is borderStroke property. The backgroundFill property is IFill type. If user sets only backgroundFill property then container dismiss the style properties like backgroundAlpha, backgroundColor, backgroundImage etc. The borderStroke property is IStroke type. If you define borderStroke property for the BorderConatiner the container ignores border style like borderColor, borderStyle, borderVisible, and borderWeight etc. These properties uses tag that is <s:backgroundFill > and <s:borderStroke >.`

In this example you can see how we can use these properties in BorderContainer

Example:

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

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

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

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

<s:BorderContainer cornerRadius="10" width="380" height="175">

<s:backgroundFill>

<s:SolidColor

color="0xE5CE5A"

alpha="100"/>

</s:backgroundFill>

<s:borderStroke>

<mx:SolidColorStroke

color="black"

weight="3"/>

</s:borderStroke>

<s:layout>

<s:VerticalLayout paddingLeft="25" paddingRight="5" paddingTop="25" paddingBottom="5"/>

</s:layout>

<mx:HBox width="341" height="52">

<s:Label text="User Name :" color="red"/>

<s:TextInput id="username" width="200" height="30"/>

</mx:HBox>

<mx:HBox width="346" height="46">

<s:Label text="Password :" color="red" width="71"/>

<s:TextInput id="password" displayAsPassword="true" width="200" height="30"/>

</mx:HBox>

<mx:HBox width="100%" horizontalAlign="center">

<s:Button label="Submit"/>

</mx:HBox>

</s:BorderContainer>

</s:Application>

In this tutorial you can see these properties also use other tags like <s:SolidColor> and <mx:SolidColorStroke>. The <s:SolidColor> tag use to set color and alpha for the background of BorderConatiner container and <mx:SolidColorStroke> tag used to set stroke color and weight for BorderContainer container.

Output:

Running Application:

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

Download this code

Related Tags for Spark BorderContainer Properties in Flex4:


Ask Questions?

If you are facing any programming issue, such as compilation errors or not able to find the code you are looking for.

Ask your questions, our development team will try to give answers to your questions.