VDividedBox Container in Flex4

The VDividedBox container is a MX component. There is no Spark Component. The VDividedBox container is used for vertical layout in which the children components are arrange in vertical manner.

The VDividedBox container is a MX component. There is no Spark Component. The VDividedBox container is used for vertical layout in which the children components are arrange in vertical manner.
VDividedBox container in Flex4:

The VDividedBox container is a MX component. There is no Spark Component.
The VDividedBox container is used for vertical layout in which the children components are arrange in vertical manner. It is similar to a VBox container, except the VDividedBox container contains a divider between each child component. You can use a mouse to move a divider for resize the component area. The tag of VDividedBox Container is <mx:VDividedBox>.

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

<fx:Script>

<![CDATA[

private function grid_initialize():void {

grid.dataProvider = [

{aName:'Bikrant', DOB:'01/01/1986',

City:'Delhi', State:'NewDelhi'},

{aName:'Brijesh', DOB:'15/07/1984',

City:'Noida', State:'Uttar Pradesh'},

{aName:'Gaurav', DOB:'27/06/1989',

City:'Mumbai', State:'Maharashtra'}

];

}

]]>

</fx:Script>

<s:Panel title="VDividedBox Container Example" width="425" height="418">

<mx:VDividedBox x="10" y="10">

<mx:Tree id="tree"

width="100%" height="100%"

labelField="@label">

<fx:XMLList id="collegedata">

<node label="College">

<node label="History"/>

<node label="About us"/>

<node label="Courses">

0
<node label="B.Tech.">

<node label="CS"/>

<node label="EC"/>

1
<node label="EI"/>

<node label="IT"/>

</node>

2
<node label="MBA">

<node label="Finance"/>

<node label="Marketing"/>

3
<node label="HR"/>

</node>

<node label="MCA"/>

4
<node label="B.Pharma."/>

</node>

<node label="Department">

5
<node label="Computer Science"/>

<node label="Electronics"/>

<node label="Managenent"/>

6
</node>

<node label="Feedback"/>

<node label="Contact us"/>

7
</node>

</fx:XMLList>

</mx:Tree>

8
<mx:DataGrid id="grid"

width="100%" height="100%"

initialize="grid_initialize();"/>

9
</mx:VDividedBox>

</s:Panel>

</s:Application>

0

Output:

Running Application:

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

Download this code

Ads