<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
private var j:uint=10;
// Event handler function to set the value of the
// ProgressBar control.
private function runit():void
{
if(j<=100)
{
bar.setProgress(j,100);
bar.label= "CurrentProgress" + " " + j + "%";
j+=10;
}
if(j>100)
{
j=0;
}
}
]]>
</mx:Script>
<mx:Panel title="ProgressBar Control Example" height="75%" width="75%"
paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10">
<mx:Label width="100%" color="blue"
text="Click the button to increment the progress bar." />
<mx:Button id="Speed" label="Run" click="runit();"/>
<mx:ProgressBar id="bar" labelPlacement="bottom" themeColor="#F20D7A"
minimum="0" visible="true" maximum="100" label="CurrentProgress 0%"
direction="right" mode="manual" width="100%"/>
</mx:Panel>
</mx:Application>
Follow the forst comment for the Example Demonstration
Flex Examples,Flex Samples,Flex with Java,RIA,Java and Flex,BlazeDS,Flex Examples,ActionScript 3.0
Flex Tree Control-example1
This Flex Treecontrol example demonstrate the simple tree navigation fo the static contents,Here we are providing the XML List as dataprovider for the <mx:Tree /> component
see the full example below and follow the comments for the demo of the flex tree control demonstration in flashplayer.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
[Bindable]
public var selectedNode:XML;
// Event handler for the Tree control change event.
public function treeChanged(event:Event):void {
selectedNode=Tree(event.target).selectedItem as XML;
}
]]>
</mx:Script>
<mx:XMLList id="treeData">
<node label="Mail Box">
<node label="Inbox">
<node label="Marketing"/>
<node label="Product Management"/>
<node label="Personal"/>
</node>
<node label="Outbox">
<node label="Professional"/>
<node label="Personal"/>
</node>
<node label="Spam"/>
<node label="Sent"/>
</node>
</mx:XMLList>
<mx:Panel title="Tree Control Example" height="75%" width="75%"
paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10">
<mx:Label width="100%" color="blue"
text="Select a node in the Tree control."/>
<mx:HDividedBox width="100%" height="100%">
<mx:Tree id="myTree" width="50%" height="100%" labelField="@label"
showRoot="false" dataProvider="{treeData}" change="treeChanged(event)"/>
<mx:TextArea height="100%" width="50%"
text="Selected Item: {selectedNode.@label}"/>
</mx:HDividedBox>
</mx:Panel>
</mx:Application>
see the full example below and follow the comments for the demo of the flex tree control demonstration in flashplayer.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
[Bindable]
public var selectedNode:XML;
// Event handler for the Tree control change event.
public function treeChanged(event:Event):void {
selectedNode=Tree(event.target).selectedItem as XML;
}
]]>
</mx:Script>
<mx:XMLList id="treeData">
<node label="Mail Box">
<node label="Inbox">
<node label="Marketing"/>
<node label="Product Management"/>
<node label="Personal"/>
</node>
<node label="Outbox">
<node label="Professional"/>
<node label="Personal"/>
</node>
<node label="Spam"/>
<node label="Sent"/>
</node>
</mx:XMLList>
<mx:Panel title="Tree Control Example" height="75%" width="75%"
paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10">
<mx:Label width="100%" color="blue"
text="Select a node in the Tree control."/>
<mx:HDividedBox width="100%" height="100%">
<mx:Tree id="myTree" width="50%" height="100%" labelField="@label"
showRoot="false" dataProvider="{treeData}" change="treeChanged(event)"/>
<mx:TextArea height="100%" width="50%"
text="Selected Item: {selectedNode.@label}"/>
</mx:HDividedBox>
</mx:Panel>
</mx:Application>
Subscribe to:
Posts (Atom)