The order of items in HBox/VBox is their childIndex order. addChildAt(myButton, 0) should put it first.
________________________________ From: [email protected] [mailto:[EMAIL PROTECTED] On Behalf Of rough68fish Sent: Tuesday, June 05, 2007 10:05 AM To: [email protected] Subject: [flexcoders] Re: Selecting which Child Components to add at runtime When showAssociate is set to true the button shows up, but I want it always to show up first. Here's my code: <?xml version="1.0" encoding="utf-8"?> <mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml <http://www.adobe.com/2006/mxml> "> <mx:Script> <![CDATA[ import mx.controls.RadioButton; // Associate Order By public function set showAssociate(val : Boolean) : void { if (val == true) { var myButton : RadioButton = getNewButton("associateRB", "Associate Name", "Associate"); myButton.selected = true; this.addChild(myButton); } else { if (this.getChildByName("associateRB") != null) { this.removeChild(this.getChildByName("associateRB")); } } } // Host Order By public function set showHost(val : Boolean) : void { if (val == true) { var myButton : RadioButton = getNewButton("hostRB", "Host Name", "Host"); this.addChild(myButton); } else { if (this.getChildByName("hostRB") != null) { this.removeChild(this.getChildByName("hostRB")); } } } // Arrival Order By public function set showArrival(val : Boolean) : void { if (val == true) { var myButton : RadioButton = getNewButton("arrivalRB", "Arrival Date", "Arrival"); this.addChild(myButton); } else { if (this.getChildByName("arrivalRB") != null) { this.removeChild(this.getChildByName("arrivalRB")); } } } // Departure Order By public function set showDeparture(val : Boolean) : void { if (val == true) { var myButton : RadioButton = getNewButton("departureRB", "Departure Date", "Departure"); this.addChild(myButton); } else { if (this.getChildByName("departureRB") != null) { this.removeChild(this.getChildByName("departureRB")); } } } // Pending Arrival Order By public function set showPArrival(val : Boolean) : void { if (val == true) { var myButton : RadioButton = getNewButton("pArrivalRB", "Pending Arrival Date", "PArrival"); this.addChild(myButton); } else { if (this.getChildByName("pArrivalRB") != null) { this.removeChild(this.getChildByName("pArrivalRB")); } } } // Pending Departure Order By public function set showPDeparture(val : Boolean) : void { if (val == true) { var myButton : RadioButton = getNewButton("pDepartureRB", "Pending Departure Date", "PDeparture"); this.addChild(myButton); } else { if (this.getChildByName("pDepartureRB") != null) { this.removeChild(this.getChildByName("pDepartureRB")); } } } protected function getNewButton(id : String, label : String, value : String) : RadioButton { var myButton : RadioButton = new RadioButton(); myButton.id = id; myButton.groupName = "orderByGrp"; myButton.label = label; myButton.value = value; return myButton; } public function reset() : void { if (this.getChildByName("associateRB") != null) { RadioButton(this.getChildByName("associateRB")).selected = true; } } ]]> </mx:Script> <mx:RadioButtonGroup id="orderByGrp"/> <!--mx:RadioButton id="associateRB" groupName="orderByGrp" label="Associate Name" value="Associate" visible="{this.showAssociate}" selected="true"/--> <!--mx:RadioButton id="hostRB" groupName="orderByGrp" label="Host Name" value="Host" visible="{this.showHost}"/--> <!--mx:RadioButton id="arrivalRB" groupName="orderByGrp" label="Arrival Date" value="Arrival" visible="{this.showArrival}"/--> <!--mx:RadioButton id="departureRB" groupName="orderByGrp" label="Departure Date" value="Departure" visible="{this.showDeparture}"/--> <!--mx:RadioButton id="pArrivalRB" groupName="orderByGrp" label="Pending Arrival Date" value="PArrival" visible="{this.showPArrival}"/--> <!--mx:RadioButton id="pDepartureRB" groupName="orderByGrp" label="Pending Departure Date" value="PDeparture" visible="{this.showPDeparture}"/--> </mx:HBox> --- In [email protected] <mailto:flexcoders%40yahoogroups.com> , "rough68fish" <[EMAIL PROTECTED]> wrote: > > Can you extend this concept slightly for me. I have several dynamic > items to display in the view (whether they are displayed is controled > through binding and set functions) this works. > > I just can figure out how to control the order that they are drawn on > the page. > > > > --- In [email protected] <mailto:flexcoders%40yahoogroups.com> , "Alex Harui" aharui@ wrote: > > > > Are you asking about: > > > > > > > > private function fAddCustomView(compClass:Class):void > > { > > var canCustView:Container = Container(new compClass()); > > canCustView.label = "Custom " + > > cbCompList.selectedItem.label; > > vsComps.addChild(canCustView); > > } > > > > > > > > ... > > > > fAddCustomView(Comp1); > > > > > > > > > > > > ________________________________ > > > > From: [email protected] <mailto:flexcoders%40yahoogroups.com> [mailto:[email protected] <mailto:flexcoders%40yahoogroups.com> ] On > > Behalf Of phall121 > > Sent: Monday, June 04, 2007 12:39 PM > > To: [email protected] <mailto:flexcoders%40yahoogroups.com> > > Subject: [flexcoders] Selecting which Child Components to add at runtime > > > > > > > > I want to add views to a ViewStack at runtime by selecting from an > > expanding table of Custom Components. > > > > As the simplified code below shows, I can figure out how to add any > > one and hard code it. But the addChild method of the ViewStack > > seems to require that you know ahead of time which component you > > want to add. I can not find in the docs or online a way to make > > this dynamic. > > > > In other words, when I define the new component view to add to the > > view stack.... > > { > > var canCustView:Comp1 = new Comp1(); > > canCustView.label = "Custom " + cbCompList.selectedItem.label; > > vsComps.addChild(canCustView); > > } > > ...I want to choose at runtime whether to instantiate views from > > Comp1, Comp17, or Comp53, etc. > > > > Any ideas how to accomplish this? Thanks for your thoughts! > > > > Here is the simplified code. > > > > <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml <http://www.adobe.com/2006/mxml> > > <http://www.adobe.com/2006/mxml <http://www.adobe.com/2006/mxml> > " > > layout="absolute" > > xmlns:comp="components.*"> > > > > <mx:Script> > > <![CDATA[ > > import components.*; > > > > private function fAddView():void > > { > > var canHardView:TestComp = new TestComp(); > > canHardView.label = "Hard-Code View2"; > > vsComps.addChild(canHardView); > > } > > > > private function fAddCustomView():void > > { > > var canCustView:Comp1 = new Comp1(); > > canCustView.label = "Custom " + > > cbCompList.selectedItem.label; > > vsComps.addChild(canCustView); > > } > > > > ]]> > > </mx:Script> > > > > <mx:Button x="25" y="36" label="Add Hard-Coded View" > > click="fAddView()"/> > > > > <mx:Button x="25" y="68" label="Add Custom Component" > > click="fAddCustomView()"/> > > > > <mx:ComboBox id="cbCompList" x="203" y="67"> > > <mx:dataProvider> > > <mx:Array id="arrCompList"> > > <mx:Object label="Component1" data="Comp1"/> > > <mx:Object label="Component2" data="Comp2"/> > > <mx:Object label="Component3" data="Comp3"/> > > <mx:Object label="Component4" data="Comp4"/> > > <mx:Object label="Component5" data="Comp5"/> > > </mx:Array> > > </mx:dataProvider> > > </mx:ComboBox> > > > > <mx:TabBar direction="vertical" dataProvider="{vsComps}" > > labelField="app" y="108" x="27"/> > > > > <mx:ViewStack id="vsComps" width="50%" height="50%" > > x="200" y="108" backgroundColor="#FFFFC9"> > > > > <mx:Canvas id="vView1" label="View1" verticalScrollPolicy="off" > > horizontalScrollPolicy="off"> > > <mx:Label x="68" y="2" width="130" text="Initial View -- > > View 1"/> > > <mx:Label id="lblViewName" x="68" y="32" width="68" > > text="Input:"/> > > <mx:TextInput id="txtiInput" x="136" y="32"/> > > </mx:Canvas> > > </mx:ViewStack> > > > > </mx:Application> > > >
