Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden using our free interactive tool and use it to determine the right price for your IT services. Start calculating Now!
How to add close button to my tabbar?
How to add close button to my tabbar?
Below is my sample code...
Thanks,
Alam.
Below is my sample code...
Thanks,
Alam.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" applicationComplete="init()" xmlns:local="*">
<mx:Style>
CustomDividedBox{
dividerAffordance:10;
dividerBorderColor:#3387A7;
dividerFillColors:#ffffff,#bad2f0;
collapseBoxDividerSkin: Embed(source="assets.swf",symbol="CollapseBoxDividerSkin");
expandBoxDividerSkin: Embed(source="assets.swf",symbol="ExpendBoxDividerSkin");
}
</mx:Style>
<mx:Script>
<![CDATA[
import DrawingClasses.Designer;
import mx.controls.Alert;
import mx.core.DragSource;
import mx.core.UIComponent;
import mx.events.DragEvent;
import mx.events.ListEvent;
import mx.managers.DragManager;
// import com.dougmccune.containers.tabBarClasses.SuperTab;
[Embed(source="Images/twowaysplit.png")]
[Bindable] private var defaultImg1:Class;
[Embed(source="Images/twowaysplit_down.png")]
[Bindable] private var overImg1:Class;
[Bindable] private var isOver1:Boolean = false;
[Embed(source="Images/threewaysplit.png")]
[Bindable] private var defaultImg2:Class;
[Embed(source="Images/threewaysplit_down.png")]
[Bindable] private var overImg2:Class;
[Bindable] private var isOver2:Boolean = false;
[Embed(source="Images/read.png")]
[Bindable] private var defaultImg3:Class;
[Embed(source="Images/read_down.png")]
[Bindable] private var overImg3:Class;
[Bindable] private var isOver3:Boolean = false;
[Embed(source="Images/write.png")]
[Bindable] private var defaultImg4:Class;
[Embed(source="Images/write_down.png")]
[Bindable] private var overImg4:Class;
[Bindable] private var isOver4:Boolean = false;
[Bindable]
[Embed(source="/Images/line.png")]
public var linePicture:Class;
[Bindable]
[Embed(source="/Images/box.png")]
public var boxPicture:Class;
[Bindable]
public var xm:XML =
<AbstractComponentTemplate></AbstractComponentTemplate>;
public var compType:XML =
<ComponentTemplateDescriptor>
<Owner>BackTesting</Owner>
<Name>Component</Name>
<Version>1</Version>
</ComponentTemplateDescriptor>;
[Bindable]
private var cm:ContextMenu;
public var xm1:XML;
public var loopparent:Array = new Array();
private var mouseTarget:DisplayObject;
private var xOff:Number;
private var yOff:Number;
private var designer:Designer = new Designer();
private var i:int;
private var j:int;
private function init():void
{
designer.setDesignArea(designArea);
var cmi1:ContextMenuItem = new ContextMenuItem("Properties", true);
cmi1.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, contextMenuItem_propertiesSelect);
var cmi2:ContextMenuItem = new ContextMenuItem("View XML", true);
cmi2.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, contextMenuItem_viewXMLSelect);
var cmi3:ContextMenuItem = new ContextMenuItem("Saved Components", true);
cmi3.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, contextMenuItem_savedListSelect);
cm = new ContextMenu();
cm.hideBuiltInItems();
cm.customItems = [cmi1, cmi2, cmi3];
cm.addEventListener(ContextMenuEvent.MENU_SELECT, contextMenu_menuSelect);
}
private function contextMenu_menuSelect(evt:ContextMenuEvent):void {
}
private function contextMenuItem_propertiesSelect(evt:ContextMenuEvent):void {
//panelRight.width = 260;
div1.state = (div1.state == CustomDividedBox.COLLAPSE ? CustomDividedBox.EXPAND : CustomDividedBox.COLLAPSE);
//Alert.show("properties");
//vDivProp.moveDivider(0, 400);
//accrWinProp.label = "Two Way Split - Properties";
//accrWinProp.selectedIndex = 1;
}
private function contextMenuItem_viewXMLSelect(evt:ContextMenuEvent):void {
viewstack.selectedIndex = 1;
}
private function contextMenuItem_savedListSelect(evt:ContextMenuEvent):void {
accrWinComp.selectedIndex = 1;
}
[Bindable]
private var propValue:String = "Component";
private function itemClickEvent(event:ListEvent):void {
var propKey:String = dgProp.selectedItem.@key;
if (propKey == "name") {
propValue = dgProp.selectedItem.propvalue;
}
}
[Bindable]
private var sourceXML:XML =
<order>
<!--This is a comment. -->
<?PROC_INSTR sample ?>
<item id='1'>
<menuName>burger</menuName>
<price>3.95</price>
</item>
<item id='2'>
<menuName>fries</menuName>
<price>1.45</price>
</item>
</order>;
[Bindable]
private var savedComp:Array=['ComponentTemplate',
'iv85341.EquityCash.v1',
'ra92724.ThreeWaySplit.EU.US.OTHERS.v1',
'ra92724.TwoWaySplit.EU.OTHERS.v1',
'ra92724.TwoWaySplit.US.OTHERS.v1',
'iv85341.VanillaNode.v1',
'iv85341.ReadGmrFs.v1'
];
[Bindable]
private var propData:XML =
<properties>
<prop key="name">
<propvalue>Component</propvalue>
<itemRenderer>mx.controls.NumericStepper</itemRenderer>
</prop>
<prop key="Version">
<propvalue>1.0</propvalue>
<itemRenderer>mx.controls.NumericStepper</itemRenderer>
</prop>
<prop key="Owner">
<propvalue>iv85341</propvalue>
<itemRenderer>mx.controls.NumericStepper</itemRenderer>
</prop>
<prop key="width">
<propvalue>250</propvalue>
<itemRenderer>mx.controls.NumericStepper</itemRenderer>
</prop>
<prop key="height">
<propvalue>300</propvalue>
<itemRenderer>mx.controls.NumericStepper</itemRenderer>
</prop>
<prop key="X-Pos">
<propvalue>40</propvalue>
<itemRenderer>mx.controls.NumericStepper</itemRenderer>
</prop>
<prop key="Y-Pos">
<propvalue>20</propvalue>
<itemRenderer>mx.controls.NumericStepper</itemRenderer>
</prop>
</properties>;
private function rightClick(event:MouseEvent):void
{
Alert.show("Properties ..." + event.currentTarget, "Open");
}
// Draging Code Starts Here
private var curDate:Date = new Date();
private var dateList:XMLList = null;
public function pictureDragDrop(event:DragEvent):void {
//Alert.show (" com = " + event.dragSource.dataForFormat("key"));
var nodeName:String = event.dragSource.dataForFormat("key").toString();
var nodeValue:String = "";
if (nodeValue == "")
{
if (xm == <AbstractComponentTemplate></AbstractComponentTemplate>)
{
xm.appendChild(compType);
dateList = new XMLList("<DateCreated>" + curDate + "</DateCreated>");
xm.appendChild(dateList);
dateList = new XMLList("<DateModified>" + curDate + "</DateModified>");
xm.appendChild(dateList);
xm1 = XML("<" + nodeName + "></" + nodeName + ">");
xm.appendChild(xm1);
}
else
{
i++;
xm1 = XML("<" + nodeName + "></" + nodeName + ">");
xm.appendChild(xm1);
//loopparent.push(xmlarray:xm1);
loopparent[i] = xm1;
}
}
else
{
var xmlList:XMLList = new XMLList("<" + nodeName + ">" + nodeValue + "</" + nodeName + ">");
if (xm1 == null)
{
xm.appendChild(xmlList);
}
else
{
for (j = i; j>0; j--)
{
(loopparent[j]).appendChild(xmlList);
//Alert.show("alert");
}
}
}
var x:int = event.currentTarget.mouseX - xOff;
var y:int = event.currentTarget.mouseY - yOff;
if(event.dragSource.dataForFormat("key") == "box")
{
designer.addBox(x, y);
}
else if(event.dragSource.dataForFormat("key") == "circle")
{
designer.addCircle(x, y);
}
else
{
designer.addRectangle(x, y);
}
}
// this method gets x and y coordinate of template box image
private function myoffset(img:Image):void {
xOff = img.mouseX;
yOff = img.mouseY;
}
// this method does acceptable draging box image
public function pictureDragEnter(event:DragEvent):void{
DragManager.acceptDragDrop(Canvas(event.target));
}
// this method supply drag box when mouse move on the design area
private function dragPicture1(event:MouseEvent, img1:Image,format:String):void{
var dragInitiator:Image=Image(event.currentTarget);
var ds:DragSource = new DragSource();
var imageProxy:Image = new Image();
imageProxy.source = img1.source;
imageProxy.height= 150;
imageProxy.width= 150;
ds.addData(format,"key");
DragManager.doDrag(dragInitiator, ds, event,imageProxy, 0, 0, 1.00);
}
// this method works when click on the line button
// it is make enable to draw line
public function doDrawEnable():void {
designer.setIsDrawEnable(true);
}
/*private function showCursor():void
{
CursorManager.setCursor(customCursor,CursorManagerPriority.HIGH,3,2);
}*/
private var fileRef:FileReference;
public function createXML():void {
var fileName:String = "component.xml";
fileRef = new FileReference();
fileRef.browse();
}
// Draging code ends here
private function onExpand(event:Event):void {
if (event.currentTarget == div1) {
//Alert.show("hi");
panelRight.width = 0;
}else{
panelLeft.width = 200;
}
// panelLeft.width=this.screen.width-100;
}
private function onCollapse(event:Event):void{
if(event.currentTarget == div1){
panelRight.width = 260;
}else{
panelLeft.width = 0;
}
// panelLeft.width=(this.width)/60;
}
]]>
</mx:Script>
<mx:Fade id="theEffect"/>
<mx:Resize id="resizeEffect" />
<mx:ApplicationControlBar dock="true">
<mx:Image toolTip="Open" useHandCursor="true" buttonMode="true" mouseChildren="false" click="createXML()" />
<mx:Image toolTip="Save" useHandCursor="true" buttonMode="true" mouseChildren="false" click="createXML()" />
<mx:Image toolTip="Undo" useHandCursor="true" buttonMode="true" mouseChildren="false" />
<mx:Image toolTip="Redo" useHandCursor="true" buttonMode="true" mouseChildren="false" />
<mx:Image toolTip="Delete" useHandCursor="true" buttonMode="true" mouseChildren="false" />
<mx:Image toolTip="Print" useHandCursor="true" buttonMode="true" mouseChildren="false" />
<mx:Spacer width="100%" />
<mx:Label text="BackTesting" fontWeight="bold" fontSize="16" />
</mx:ApplicationControlBar>
<mx:Resize duration="250" id="r1"/>
<local:CustomDividedBox id="div1" width="100%" height="100%" direction="horizontal" expand="onExpand(event)" collapse="onCollapse(event)">
<local:CustomDividedBox id="div2" width="100%" height="100%" direction="horizontal" expand="onExpand(event)" collapse="onCollapse(event)">
<mx:VDividedBox id="panelLeft" height="100%" width="20%" resizeEffect="r1">
<mx:Panel title="Drawing Components" width="100%" height="100%" layout="vertical" >
<mx:Accordion id="accrWinComp" x="151" y="135" width="100%" height="100%">
<mx:Panel label="Nodes" width="100%" height="100%" layout="vertical" borderThicknessTop="-20" paddingTop = "20" paddingLeft = "20" >
<mx:Image id="twowaysplit" source="{isOver1 ? overImg1 : defaultImg1}" mouseOver="isOver1 = true" mouseOut="isOver1 = false" toolTip="TwoWay Split" useHandCursor="true" buttonMode="true" mouseMove="dragPicture1(event, twowaysplit, 'twowaysplit');myoffset(twowaysplit);" width="28" height="28" ></mx:Image>
<mx:Image id="threewaysplit" source="{isOver2 ? overImg2 : defaultImg2}" mouseOver="isOver2 = true" mouseOut="isOver2 = false" toolTip="Three Way Split" useHandCursor="true" buttonMode="true" mouseMove="dragPicture1(event, threewaysplit, 'threewaysplit');myoffset(threewaysplit);" width="28" height="28" ></mx:Image>
<mx:Image id="reader" source="{isOver3 ? overImg3 : defaultImg3}" mouseOver="isOver3 = true" mouseOut="isOver3 = false" toolTip="Reader" useHandCursor="true" buttonMode="true" mouseMove="dragPicture1(event, reader, 'reader');myoffset(reader);" width="28" height="28" ></mx:Image>
<mx:Image id="writer" source="{isOver4 ? overImg4 : defaultImg4}" mouseOver="isOver4 = true" mouseOut="isOver4 = false" toolTip="Writer" useHandCursor="true" buttonMode="true" mouseMove="dragPicture1(event, writer, 'writer');myoffset(writer);" width="28" height="28" ></mx:Image>
<!--<mx:Button label="Show Cursor" click="showCursor()" x="10" y="59" width="115"/>-->
<!-- <mx:Image id="line" width="28" height="28" source="@Embed(source='Images/line.png')" toolTip="Line" useHandCursor="true" buttonMode="true" click="doDrawEnable()" ></mx:Image>-->
<mx:Button id="line" width="35" height="30" toggle="true" paddingLeft="12" paddingRight="12" icon="@Embed(source='Images/line.png')" toolTip="Line" useHandCursor="true" buttonMode="true" click="doDrawEnable()" ></mx:Button>
</mx:Panel>
<mx:Panel label="Saved Components" width="100%" height="100%" borderThicknessTop="-20">
<mx:List height="100%" width="100%" dataProvider="{savedComp}" />
</mx:Panel>
</mx:Accordion>
</mx:Panel>
</mx:VDividedBox>
<mx:VDividedBox id="mp" height="100%" width="100%">
<mx:HDividedBox width="100%" height="100%">
<mx:Canvas width="100%" height="100%" >
<mx:TabBar x="0" y="10" dataProvider="viewstack"/>
<mx:ViewStack id="viewstack" width="100%" height="100%" y="32">
<mx:Canvas backgroundColor="#ffffff" borderColor="0xB7BABC" borderStyle="solid" borderThickness="7" label="{propValue}" id="designArea" contextMenu="{cm}" dragEnter="pictureDragEnter(event)" dragDrop="pictureDragDrop(event)" width="100%" height="100%" >
</mx:Canvas>
<mx:Panel id="pnlXML" label="XML" width="100%" height="100%" showEffect="{theEffect}" >
<mx:ControlBar width="100%" barColor="#FF22CC">
<mx:Spacer width="100%"/>
<mx:Button id="btnSave" label="Save" useHandCursor="true" buttonMode="true" mouseChildren="false" click="createXML()" />
</mx:ControlBar>
<mx:TextArea fontSize="12" wordWrap="false" textIndent="8" id="txtAreaXML" text="{xm}" width="100%" height="100%" editable="false" />
</mx:Panel>
</mx:ViewStack>
</mx:Canvas>
</mx:HDividedBox>
</mx:VDividedBox>
</local:CustomDividedBox>
<mx:VDividedBox id="panelRight" height="100%" width="0" resizeEffect="{resizeEffect}" >
<!--<mx:Panel title="Component Properties" width="100%" height="100%" layout="vertical" >
<mx:Accordion id="accrWinProp" x="51" y="35" width="100%" height="100%"> -->
<mx:Panel id="accrCon2" title="Component Properties" width="100%" height="100%" >
<mx:DataGrid id="dgProp" dataProvider="{propData.prop}" height="100%" width="100%" editable="true" itemClick="itemClickEvent(event);">
<mx:columns>
<mx:DataGridColumn dataField="@key" headerText="Property" editable="false" />
<mx:DataGridColumn dataField="propvalue" headerText="Value" editable="true" />
</mx:columns>
</mx:DataGrid>
</mx:Panel>
<!--</mx:Accordion>
</mx:Panel>-->
</mx:VDividedBox>
</local:CustomDividedBox>
</mx:Application>
Do more with
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Here we are using flex3.
Actually we are trying to add components to tabbar through viewstack.
can u provide some sample code.
Thanks,
Alam.
Actually we are trying to add components to tabbar through viewstack.
can u provide some sample code.
Thanks,
Alam.
FYI
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" applicationComplete="init()" xmlns:local="*">
<mx:Style>
CustomDividedBox{
dividerAffordance:10;
dividerBorderColor:#3387A7;
dividerFillColors:#ffffff,#bad2f0;
collapseBoxDividerSkin: Embed(source="assets.swf",symbol="CollapseBoxDividerSkin");
expandBoxDividerSkin: Embed(source="assets.swf",symbol="ExpendBoxDividerSkin");
}
</mx:Style>
<mx:Script>
<![CDATA[
import DrawingClasses.Designer;
import mx.controls.Alert;
import mx.core.DragSource;
import mx.core.UIComponent;
import mx.events.DragEvent;
import mx.events.ListEvent;
import mx.managers.DragManager;
[Embed(source="Images/twowaysplit.png")]
[Bindable] private var defaultImg1:Class;
[Embed(source="Images/twowaysplit_down.png")]
[Bindable] private var overImg1:Class;
[Bindable] private var isOver1:Boolean = false;
[Embed(source="Images/threewaysplit.png")]
[Bindable] private var defaultImg2:Class;
[Embed(source="Images/threewaysplit_down.png")]
[Bindable] private var overImg2:Class;
[Bindable] private var isOver2:Boolean = false;
[Embed(source="Images/read.png")]
[Bindable] private var defaultImg3:Class;
[Embed(source="Images/read_down.png")]
[Bindable] private var overImg3:Class;
[Bindable] private var isOver3:Boolean = false;
[Embed(source="Images/write.png")]
[Bindable] private var defaultImg4:Class;
[Embed(source="Images/write_down.png")]
[Bindable] private var overImg4:Class;
[Bindable] private var isOver4:Boolean = false;
[Bindable]
[Embed(source="/Images/line.png")]
public var linePicture:Class;
[Bindable]
[Embed(source="/Images/box.png")]
public var boxPicture:Class;
[Bindable]
public var xm:XML =
<AbstractComponentTemplate></AbstractComponentTemplate>;
public var compType:XML =
<ComponentTemplateDescriptor>
<Owner>BackTesting</Owner>
<Name>Component</Name>
<Version>1</Version>
</ComponentTemplateDescriptor>;
[Bindable]
private var cm:ContextMenu;
public var xm1:XML;
public var loopparent:Array = new Array();
private var mouseTarget:DisplayObject;
private var xOff:Number;
private var yOff:Number;
private var designer:Designer = new Designer();
private var i:int;
private var j:int;
private function init():void
{
designer.setDesignArea(designArea);
var cmi1:ContextMenuItem = new ContextMenuItem("Properties", true);
cmi1.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, contextMenuItem_propertiesSelect);
var cmi2:ContextMenuItem = new ContextMenuItem("View XML", true);
cmi2.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, contextMenuItem_viewXMLSelect);
var cmi3:ContextMenuItem = new ContextMenuItem("Saved Components", true);
cmi3.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, contextMenuItem_savedListSelect);
cm = new ContextMenu();
cm.hideBuiltInItems();
cm.customItems = [cmi1, cmi2, cmi3];
cm.addEventListener(ContextMenuEvent.MENU_SELECT, contextMenu_menuSelect);
}
private function contextMenu_menuSelect(evt:ContextMenuEvent):void {
}
private function contextMenuItem_propertiesSelect(evt:ContextMenuEvent):void {
//panelRight.width = 260;
div1.state = (div1.state == CustomDividedBox.COLLAPSE ? CustomDividedBox.EXPAND : CustomDividedBox.COLLAPSE);
//Alert.show("properties");
//vDivProp.moveDivider(0, 400);
//accrWinProp.label = "Two Way Split - Properties";
//accrWinProp.selectedIndex = 1;
}
private function contextMenuItem_viewXMLSelect(evt:ContextMenuEvent):void {
viewstack.selectedIndex = 1;
}
private function contextMenuItem_savedListSelect(evt:ContextMenuEvent):void {
accrWinComp.selectedIndex = 1;
}
[Bindable]
private var propValue:String = "Component";
private function itemClickEvent(event:ListEvent):void {
var propKey:String = dgProp.selectedItem.@key;
if (propKey == "name") {
propValue = dgProp.selectedItem.propvalue;
}
}
[Bindable]
private var sourceXML:XML =
<order>
<!--This is a comment. -->
<?PROC_INSTR sample ?>
<item id='1'>
<menuName>burger</menuName>
<price>3.95</price>
</item>
<item id='2'>
<menuName>fries</menuName>
<price>1.45</price>
</item>
</order>;
[Bindable]
private var savedComp:Array=['ComponentTemplate',
'iv85341.EquityCash.v1',
'ra92724.ThreeWaySplit.EU.US.OTHERS.v1',
'ra92724.TwoWaySplit.EU.OTHERS.v1',
'ra92724.TwoWaySplit.US.OTHERS.v1',
'iv85341.VanillaNode.v1',
'iv85341.ReadGmrFs.v1'
];
[Bindable]
private var propData:XML =
<properties>
<prop key="name">
<propvalue>Component</propvalue>
<itemRenderer>mx.controls.NumericStepper</itemRenderer>
</prop>
<prop key="Version">
<propvalue>1.0</propvalue>
<itemRenderer>mx.controls.NumericStepper</itemRenderer>
</prop>
<prop key="Owner">
<propvalue>iv85341</propvalue>
<itemRenderer>mx.controls.NumericStepper</itemRenderer>
</prop>
<prop key="width">
<propvalue>250</propvalue>
<itemRenderer>mx.controls.NumericStepper</itemRenderer>
</prop>
<prop key="height">
<propvalue>300</propvalue>
<itemRenderer>mx.controls.NumericStepper</itemRenderer>
</prop>
<prop key="X-Pos">
<propvalue>40</propvalue>
<itemRenderer>mx.controls.NumericStepper</itemRenderer>
</prop>
<prop key="Y-Pos">
<propvalue>20</propvalue>
<itemRenderer>mx.controls.NumericStepper</itemRenderer>
</prop>
</properties>;
private function rightClick(event:MouseEvent):void
{
Alert.show("Properties ..." + event.currentTarget, "Open");
}
// Draging Code Starts Here
private var curDate:Date = new Date();
private var dateList:XMLList = null;
public function pictureDragDrop(event:DragEvent):void {
//Alert.show (" com = " + event.dragSource.dataForFormat("key"));
var nodeName:String = event.dragSource.dataForFormat("key").toString();
var nodeValue:String = "";
if (nodeValue == "")
{
if (xm == <AbstractComponentTemplate></AbstractComponentTemplate>)
{
xm.appendChild(compType);
dateList = new XMLList("<DateCreated>" + curDate + "</DateCreated>");
xm.appendChild(dateList);
dateList = new XMLList("<DateModified>" + curDate + "</DateModified>");
xm.appendChild(dateList);
xm1 = XML("<" + nodeName + "></" + nodeName + ">");
xm.appendChild(xm1);
}
else
{
i++;
xm1 = XML("<" + nodeName + "></" + nodeName + ">");
xm.appendChild(xm1);
//loopparent.push(xmlarray:xm1);
loopparent[i] = xm1;
}
}
else
{
var xmlList:XMLList = new XMLList("<" + nodeName + ">" + nodeValue + "</" + nodeName + ">");
if (xm1 == null)
{
xm.appendChild(xmlList);
}
else
{
for (j = i; j>0; j--)
{
(loopparent[j]).appendChild(xmlList);
//Alert.show("alert");
}
}
}
var x:int = event.currentTarget.mouseX - xOff;
var y:int = event.currentTarget.mouseY - yOff;
if(event.dragSource.dataForFormat("key") == "box")
{
designer.addBox(x, y);
}
else if(event.dragSource.dataForFormat("key") == "circle")
{
designer.addCircle(x, y);
}
else
{
designer.addRectangle(x, y);
}
}
// this method gets x and y coordinate of template box image
private function myoffset(img:Image):void {
xOff = img.mouseX;
yOff = img.mouseY;
}
// this method does acceptable draging box image
public function pictureDragEnter(event:DragEvent):void{
DragManager.acceptDragDrop(Canvas(event.target));
}
// this method supply drag box when mouse move on the design area
private function dragPicture1(event:MouseEvent, img1:Image,format:String):void{
var dragInitiator:Image=Image(event.currentTarget);
var ds:DragSource = new DragSource();
var imageProxy:Image = new Image();
imageProxy.source = img1.source;
imageProxy.height= 150;
imageProxy.width= 150;
ds.addData(format,"key");
DragManager.doDrag(dragInitiator, ds, event,imageProxy, 0, 0, 1.00);
}
// this method works when click on the line button
// it is make enable to draw line
public function doDrawEnable():void {
designer.setIsDrawEnable(true);
}
/*private function showCursor():void
{
CursorManager.setCursor(customCursor,CursorManagerPriority.HIGH,3,2);
}*/
private var fileRef:FileReference;
public function createXML():void {
var fileName:String = "component.xml";
fileRef = new FileReference();
fileRef.browse();
}
// Draging code ends here
private function onExpand(event:Event):void {
if (event.currentTarget == div1) {
//Alert.show("hi");
panelRight.width = 0;
}else{
panelLeft.width = 200;
}
// panelLeft.width=this.screen.width-100;
}
private function onCollapse(event:Event):void{
if(event.currentTarget == div1){
panelRight.width = 260;
}else{
panelLeft.width = 0;
}
// panelLeft.width=(this.width)/60;
}
]]>
</mx:Script>
<mx:Fade id="theEffect"/>
<mx:Resize id="resizeEffect" />
<mx:ApplicationControlBar dock="true">
<mx:Image toolTip="Open" useHandCursor="true" buttonMode="true" mouseChildren="false" click="createXML()" />
<mx:Image toolTip="Save" useHandCursor="true" buttonMode="true" mouseChildren="false" click="createXML()" />
<mx:Image toolTip="Undo" useHandCursor="true" buttonMode="true" mouseChildren="false" />
<mx:Image toolTip="Redo" useHandCursor="true" buttonMode="true" mouseChildren="false" />
<mx:Image toolTip="Delete" useHandCursor="true" buttonMode="true" mouseChildren="false" />
<mx:Image toolTip="Print" useHandCursor="true" buttonMode="true" mouseChildren="false" />
<mx:Spacer width="100%" />
<mx:Label text="BackTesting" fontWeight="bold" fontSize="16" />
</mx:ApplicationControlBar>
<mx:Resize duration="250" id="r1"/>
<local:CustomDividedBox id="div1" width="100%" height="100%" direction="horizontal" expand="onExpand(event)" collapse="onCollapse(event)">
<local:CustomDividedBox id="div2" width="100%" height="100%" direction="horizontal" expand="onExpand(event)" collapse="onCollapse(event)">
<mx:VDividedBox id="panelLeft" height="100%" width="20%" resizeEffect="r1">
<mx:Panel title="Drawing Components" width="100%" height="100%" layout="vertical" >
<mx:Accordion id="accrWinComp" x="151" y="135" width="100%" height="100%">
<mx:Panel label="Nodes" width="100%" height="100%" layout="vertical" borderThicknessTop="-20" paddingTop = "20" paddingLeft = "20" >
<mx:Image id="twowaysplit" source="{isOver1 ? overImg1 : defaultImg1}" mouseOver="isOver1 = true" mouseOut="isOver1 = false" toolTip="TwoWay Split" useHandCursor="true" buttonMode="true" mouseMove="dragPicture1(event, twowaysplit, 'twowaysplit');myoffset(twowaysplit);" width="28" height="28" ></mx:Image>
<mx:Image id="threewaysplit" source="{isOver2 ? overImg2 : defaultImg2}" mouseOver="isOver2 = true" mouseOut="isOver2 = false" toolTip="Three Way Split" useHandCursor="true" buttonMode="true" mouseMove="dragPicture1(event, threewaysplit, 'threewaysplit');myoffset(threewaysplit);" width="28" height="28" ></mx:Image>
<mx:Image id="reader" source="{isOver3 ? overImg3 : defaultImg3}" mouseOver="isOver3 = true" mouseOut="isOver3 = false" toolTip="Reader" useHandCursor="true" buttonMode="true" mouseMove="dragPicture1(event, reader, 'reader');myoffset(reader);" width="28" height="28" ></mx:Image>
<mx:Image id="writer" source="{isOver4 ? overImg4 : defaultImg4}" mouseOver="isOver4 = true" mouseOut="isOver4 = false" toolTip="Writer" useHandCursor="true" buttonMode="true" mouseMove="dragPicture1(event, writer, 'writer');myoffset(writer);" width="28" height="28" ></mx:Image>
<!--<mx:Button label="Show Cursor" click="showCursor()" x="10" y="59" width="115"/>-->
<!-- <mx:Image id="line" width="28" height="28" source="@Embed(source='Images/line.png')" toolTip="Line" useHandCursor="true" buttonMode="true" click="doDrawEnable()" ></mx:Image>-->
<mx:Button id="line" width="35" height="30" toggle="true" paddingLeft="12" paddingRight="12" icon="@Embed(source='Images/line.png')" toolTip="Line" useHandCursor="true" buttonMode="true" click="doDrawEnable()" ></mx:Button>
</mx:Panel>
<mx:Panel label="Saved Components" width="100%" height="100%" borderThicknessTop="-20">
<mx:List height="100%" width="100%" dataProvider="{savedComp}" />
</mx:Panel>
</mx:Accordion>
</mx:Panel>
</mx:VDividedBox>
<mx:VDividedBox id="mp" height="100%" width="100%">
<mx:HDividedBox width="100%" height="100%">
<mx:Canvas width="100%" height="100%" >
<mx:TabBar x="0" y="10" dataProvider="viewstack"/>
<mx:ViewStack id="viewstack" width="100%" height="100%" y="32">
<mx:Canvas backgroundColor="#ffffff" borderColor="0xB7BABC" borderStyle="solid" borderThickness="7" label="{propValue}" id="designArea" contextMenu="{cm}" dragEnter="pictureDragEnter(event)" dragDrop="pictureDragDrop(event)" width="100%" height="100%" >
</mx:Canvas>
<mx:Panel id="pnlXML" label="XML" width="100%" height="100%" showEffect="{theEffect}" >
<mx:ControlBar width="100%" barColor="#FF22CC">
<mx:Spacer width="100%"/>
<mx:Button id="btnSave" label="Save" useHandCursor="true" buttonMode="true" mouseChildren="false" click="createXML()" />
</mx:ControlBar>
<mx:TextArea fontSize="12" wordWrap="false" textIndent="8" id="txtAreaXML" text="{xm}" width="100%" height="100%" editable="false" />
</mx:Panel>
</mx:ViewStack>
</mx:Canvas>
</mx:HDividedBox>
</mx:VDividedBox>
</local:CustomDividedBox>
<mx:VDividedBox id="panelRight" height="100%" width="0" resizeEffect="{resizeEffect}" >
<!--<mx:Panel title="Component Properties" width="100%" height="100%" layout="vertical" >
<mx:Accordion id="accrWinProp" x="51" y="35" width="100%" height="100%"> -->
<mx:Panel id="accrCon2" title="Component Properties" width="100%" height="100%" >
<mx:DataGrid id="dgProp" dataProvider="{propData.prop}" height="100%" width="100%" editable="true" itemClick="itemClickEvent(event);">
<mx:columns>
<mx:DataGridColumn dataField="@key" headerText="Property" editable="false" />
<mx:DataGridColumn dataField="propvalue" headerText="Value" editable="true" />
</mx:columns>
</mx:DataGrid>
</mx:Panel>
<!--</mx:Accordion>
</mx:Panel>-->
</mx:VDividedBox>
</local:CustomDividedBox>
</mx:Application>
If using Flex 3,
Look at SmartTabNavigator Component, This is a part of flexlib
http://flexlib.googlecode.com/svn/trunk/docs/flexlib/containers/SuperTabNavigator.html
http://code.google.com/p/flexlib/
Look at SmartTabNavigator Component, This is a part of flexlib
http://flexlib.googlecode.com/svn/trunk/docs/flexlib/containers/SuperTabNavigator.html
http://code.google.com/p/flexlib/
Premium Content
You need an Expert Office subscription to comment.Start Free Trial