We help IT Professionals succeed at work.
Get Started
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>
Why Experts Exchange?
Experts Exchange always has the answer, or at the least points me in the correct direction! It is like having another employee that is extremely experienced.
Jim Murphy
Programmer at Smart IT Solutions
When asked, what has been your best career decision?
Deciding to stick with EE.
Mohamed Asif
Technical Department Head
Being involved with EE helped me to grow personally and professionally.
Carl Webster
CTP, Sr Infrastructure Consultant
Ask ANY Question
Connect with Certified Experts to gain insight and support on specific technology challenges including:
- Troubleshooting
- Research
- Professional Opinions
Did You Know?
We've partnered with two important charities to provide clean water and computer science education to those who need it most. READ MORE