>From memory, the documentation says that the controlbar must be the
last child added to the window. You are adding the controlbar to an
Hbox that has already been added to the window.

Try adding the controlbar directly to the window as the last item to
be added.


--- In [email protected], "carriefieldsamy" <[EMAIL PROTECTED]> wrote:
>
> Hi Everyone,
> 
> I'm trying to dynamically create dragable TitleWindows with
> ControlBars and the ControlBars are not showing up. At this point I am
> adding a label to the control bar. Eventually it will be an image.
> 
> Thanks in Advance!
> 
> Here's the code:
> 
> <?xml version="1.0" encoding="utf-8"?>
> <core:DashboardModuleBase
>       xmlns:mx="http://www.adobe.com/2006/mxml";
>       xmlns:core="com.arc90.dashboard.view.core.*"
>       xmlns:arcComps="com.arc90.flexlib.controls.*"
>       xmlns:comps="com.arc90.dashboard.view.components.*" 
>       layout="absolute"
>       creationComplete="facade.startup(this)">
>       
>       <mx:Script>
>               <![CDATA[
>                       import mx.controls.Button;
>                       import mx.containers.ControlBar;
>                       
>                       import com.arc90.dashboard.ApplicationFacade;
>                       import mx.events.DragEvent;
>                       import mx.events.FlexEvent;
>                       import mx.core.DragSource;
>                       import mx.managers.DragManager;
>                       import mx.containers.TitleWindow;
>                       import com.arc90.dashboard.view.components.DragWindow;
>                       import mx.events.CloseEvent;
>                       import mx.collections.ArrayCollection;
>                       import mx.containers.HBox;
>                       import mx.controls.Label;
>                       import mx.controls.TextInput;
>                       
>                               
>                       [Embed(source="/assets/icons/policyicon.png")]
>             [Bindable]
>             private var policyWidgetAddImage:Class;
>             
>             [Embed(source="/assets/icons/reporticon.png")]
>             [Bindable]
>             private var reportWidgetAddImage:Class;
>             
>             [Embed(source="/assets/icons/rssicon.png")]
>             [Bindable]
>             private var rssWidgetAddImage:Class;
>             
>             private var policyWidgetID:int = -1;
>             private var reportWidgetID:int = -1;
>             private var rssWidgetID:int = -1;
>                       
>                       private var policyWidgetsAC:ArrayCollection = new 
> ArrayCollection(); 
>                       private var reportWidgetsAC:ArrayCollection = new 
> ArrayCollection();
>                       private var rssWidgetAC:ArrayCollection = new 
> ArrayCollection();
>                               
>                        // Function called by the canvas dragEnter event; 
> enables dropping
>             private function doDragEnter(event:DragEvent):void 
>             {
>                 DragManager.acceptDragDrop(Canvas(event.target));
>             }
>             
>             // Variables used to hold the mouse pointer's location in
> the title bar.
>             // Since the mouse pointer can be anywhere in the title
> bar, you have to 
>             // compensate for it when you drop the panel. 
>             public var xOff:Number;
>             public var yOff:Number;
>             
>             // Function called by the Canvas dragDrop event; 
>             // Sets the panel's position, 
>             // "dropping" it in its new location.
>             private function doDragDrop(event:DragEvent):void 
>             {
>                               // Compensate for the mouse pointer's location 
> in the title bar.
>                               var tempX:int = event.currentTarget.mouseX - 
> xOff;
>                               event.dragInitiator.x = tempX;
>                               
>                               var tempY:int = event.currentTarget.mouseY - 
> yOff;
>                               event.dragInitiator.y = tempY;
>                               
>                               // Put the dragged panel on top of all other 
> components.
>                               
> canvas.setChildIndex(TitleWindow(event.dragInitiator),
> canvas.numChildren-1);                        
>             }
>             
>             // creates the widgets config view and adds it to the
canvas.
>             // this should happen in a widget creator file.
>                       private function 
> addWidgetClickHandler(event:MouseEvent):void{
>                     var dw:DragWindow = new DragWindow();
>                     var hbox:HBox = new HBox();
>                     var label:Label = new Label();
>                     var textField:TextInput = new TextInput();
>                     var controlBar:ControlBar = new ControlBar();
>                     
>                     var img:Image = new Image();
>                     img.source = rssWidgetAddImage;
>                     
>                     var lbl:Label = new Label();
>                     lbl.text = "some text in the controlbar";
>                     
>                     controlBar.addChild(lbl);
>                     
>                     dw.setStyle("paddingLeft","10");
>                     dw.setStyle("paddingRight","10");
>                     dw.setStyle("paddingTop","10");
>                     dw.setStyle("paddingBottom","10");   
>                     dw.showCloseButton = true;
>                     dw.horizontalScrollPolicy = "off";
>                     dw.verticalScrollPolicy = "off";
>                     dw.addEventListener(CloseEvent.CLOSE, removeMe);
>                     
>                     // widget specific config
>                         switch(event.currentTarget.id)
>                         {
>                                       case "imgAddPolicy":
>                                               dw.title = "Policy Search";
>                                           policyWidgetID = policyWidgetID + 1;
>                                           dw.id = policyWidgetID.toString();
>                                           dw.width = 200;
>                                           dw.height = 90;
>                                           label.text = "Policy ID:";// dynamic
>                                           textField.width = 90; // widget 
> specific            
>                                               break;
>                                               
>                                       case "imgAddReport":
>                                               dw.title = "Report Search";
>                                           reportWidgetID = reportWidgetID + 1;
>                                           dw.id = reportWidgetID.toString();
>                                           dw.width = 300;
>                                           dw.height = 90;
>                                           label.text = "Report URL:";// 
> dynamic
>                                           textField.width = 150; // widget 
> specific
>                                               break;
>                                               
>                                       case "imgAddRSS":
>                                               dw.title = "RSS Feed";
>                                           rssWidgetID = rssWidgetID + 1;
>                                           dw.id = rssWidgetID.toString();
>                                           dw.width = 300;
>                                           dw.height = 90;
>                                           label.text = "RSS Feed URL:";// 
> dynamic
>                                           textField.width = 150; // widget 
> specific
>                                               break;                          
>                         }                   
>                     
>                     // add children to the hbox
>                     hbox.addChild(label); // add label to the hbox
>                     hbox.addChild(textField);// add text field to hbox
>                     
>                     // add children to the component
>                     dw.addChild(hbox);// add hbox to display window 
> (titleWindow
> called dw)
>                    
>
//dw.addEventListener(FlexEvent.CREATION_COMPLETE,onCompleteAddControlBar);
>                     controlBar.percentWidth = 100;
>                     
>                     hbox.addChildAt(controlBar,dw.numChildren+1);
>                       
>                     dw.createComponentsFromDescriptors();
>                    // dw.percentHeight = 100;
>                     
>                     // position component
>                     var canvasHalfWidth:int =  canvas.width/2;
>                     var widgetHalfWidth:int = dw.width/2;
>                     dw.x = canvasHalfWidth - widgetHalfWidth;
>                     canvas.addChild(dw);// add title window to canvas         
>         
>                         
>                                               //textField.text = dw.id;// 
> displays id in text box ** take out
>                       }
>                       
>                       
>                       private function removeMe(event:CloseEvent):void{       
>         
>                       canvas.removeChild(event.currentTarget as 
> DisplayObject);
>                   }
>                   
>                   // Creation complete handler for each panel to add the 
>             // mouseMove event handler to the title bar. 
>             // Clicking the mouse button, then moving the mouse on the
> title bar (myTitleBar as exposed through DragWindow)
>             // initiates the d&d operation. 
>             private function myPanelCCHandler(event:Event):void 
>             {
>               
>             
> event.currentTarget.myTitleBar.addEventListener(MouseEvent.MOUSE_DOWN,
> tbMouseMoveHandler);
>             }
>             
>                       // Drag initiator event handler for
>             // the title bar's mouseMove event.
>             private function tbMouseMoveHandler(event:MouseEvent):void 
>             {
>                 var
> dragInitiator:TitleWindow=TitleWindow(event.currentTarget.parent);
>                 var ds:DragSource = new DragSource();
>                 ds.addData(event.currentTarget.parent, 'titleWindow'); 
>                 
>                   // Update the xOff and yOff variables to show the
>               // current mouse location in the Panel.  
>                 xOff = event.currentTarget.mouseX;
>                 yOff = event.currentTarget.mouseY;
>                 
>                 // Initiate d&d. 
>                 DragManager.doDrag(dragInitiator, ds, event);        
>            
>             } 
>                       
> 
>               ]]>
>       </mx:Script>
>               
>       <!-- view components here -->
>       <mx:VBox id="dashboardVBox" width="100%" height="100%" >
>               
>               <arcComps:Banner id="myBanner" 
>                       minHeight="40"
>                       message="testing the banner"
>                       backgroundColor="#FCA702" 
>                       width="100%" visible="true" cornerRadius="10"/>
>                       
>               <mx:Canvas id="canvas" 
>                       width="100%" height="100%"
>                       dragEnter="doDragEnter(event);" 
>               dragDrop="doDragDrop(event);">
>               </mx:Canvas>
>               
>               <!-- add fisheye component -->
>               <mx:HBox id="widgetBox" 
>                       visible="true" 
>                       horizontalGap="20" 
>                       width="100%" 
>                       borderColor="#ffcc00" borderStyle="solid" 
> borderThickness="2" 
>                       backgroundColor="#FFCC00" backgroundAlpha="0.3"
>                       paddingBottom="5" paddingTop="10" paddingLeft="5" 
> paddingRight="5">
>                       <mx:Spacer width="100%"/>
>                       <mx:Image id="imgAddPolicy" 
> source="{policyWidgetAddImage}"
> width="64" height="64" click="addWidgetClickHandler(event)"/>
>                       <mx:Image id="imgAddReport" 
> source="{reportWidgetAddImage}"
> width="64" height="64" click="addWidgetClickHandler(event)"/>
>                       <mx:Image id="imgAddRSS" source="{rssWidgetAddImage}"
> click="addWidgetClickHandler(event)"/>
>                       <mx:Spacer width="100%"/>
>               </mx:HBox>
>                       
>       </mx:VBox>
> 
>       
> </core:DashboardModuleBase>
> 
> 
> DragWindow.as
> 
> package com.arc90.dashboard.view.components
> {
> 
>       import flash.events.Event;
>       
>       import mx.containers.ControlBar;
>       import mx.containers.TitleWindow;
>       import mx.core.UIComponent;
>       import mx.events.FlexEvent;
> 
>       public class DragWindow extends TitleWindow
>       {
>               // Add the creationCOmplete event handler.
>               public function DragWindow()
>               {
>                       super();
>                       isPopUp = true;
>                       addEventListener(FlexEvent.CREATION_COMPLETE,
creationCompleteHandler);
>               }
>               
>               // Expose the title bar property for draggin and dropping.
>               // can refer to myTitleBar outside of this file.
>               [Bindable]
>               public var myTitleBar:UIComponent;
>               
>                                       
>               private function creationCompleteHandler(event:Event):void
>               {
>                       myTitleBar = titleBar;
>               }
> 
>       }
> }
>


Reply via email to