Home Tutorial Flex Flex4 Components Group Container in Flex4

 
 

Share on Google+Share on Google+
Group Container in Flex4
Posted on: May 11, 2010 at 12:00 AM
Advertisement
The Spark Group containers take any components as a child which implement the IVisualElement interface. When you want to manage visual children component (both visual components and graphical components) you can use Group container.

Group container in Flex4:

The Spark Group containers take any components as a child which implement the IVisualElement interface. When you want to manage visual children component (both visual components and graphical components) you can use Group container. The Group container is designed for simplicity and it cannot be skinned. The BasicLayout is the default layout class of the Group container. You can use Horizontal and Vertical layout with Group container also. The tag of Group container is <s:Group>.

The following example shows how to implement Group container.

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">

<fx:Script>

<![CDATA[

private function add():void{

txt.text="You have click on Addition Button";

}

private function sub():void{

txt.text="You have click on Subtraction Button";

}

private function mul():void{

txt.text="You have click on Multiplication Button";

}

private function div():void{

txt.text="You have click on Division Button";

}

]]>

</fx:Script>

<s:Panel title="Group Container Example" width="400" height="141" color="#990000">

<s:Group>

<s:Button label="Addition" id="btn1" left="10" top="10" bottom="10" click="add()"/>

<s:Button label="Subtraction" id="btn2" left="95" top="10" bottom="10" click="sub()"/>

<s:Button label="Multiplication" id="btn3" left="196" top="10" bottom="10" click="mul()"/>

<s:Button label="Division" id="btn4" left="306" top="11" bottom="9" right="14" click="div()"/>

</s:Group>

<s:TextInput id="txt" x="68" y="49" width="252" color="Blue">

</s:TextInput>

</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

Advertisement

Related Tags for Group Container in Flex4:


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.

Posted on: May 11, 2010

Recommend the tutorial

Advertisements Advertisements
 

 

 

DMCA.com