do you have an example of this technique?
----- Original Message ----
From: Alex Harui <[EMAIL PROTECTED]>
To: [email protected]
Sent: Tuesday, June 5, 2007 3:35:10 PM
Subject: RE: [flexcoders] Re: Selecting which Child Components to add at runtime
You could try changing .visible and .includeInLayout
instead of adding/removing.
The best practice for resolving multiple properties
is to use the invalidatePropertie s/commitProperti es technique.
From:
[EMAIL PROTECTED] ups.com [mailto:flexcoders@ yahoogroups. com] On Behalf Of
Sean Sell
Sent: Tuesday, June 05, 2007 11:13
AM
To: [EMAIL PROTECTED] ups.com
Subject: Re: [flexcoders] Re:
Selecting which Child Components to add at runtime
Not quite. I have items 0
through 5 I want them to be displayed in that order but if 4 is not displayed
then I get an out of bounds error when I addChild At 5. It may happen when 2 is
drawn even if 0 and 1 are going to be drawn but since I have no control over
order it evaluates the variables in the MXML invocation that will generate an
error also
i.e.
<reportComps: OrderBy id="userOrderBy"
showAssociate= "true" showArrival= "true"
showPDeparture= "true" showHost="true" />
----- Original Message
----
From: Alex Harui <[EMAIL PROTECTED] com>
To: [EMAIL PROTECTED] ups.com
Sent: Tuesday, June 5, 2007 1:20:41 PM
Subject: RE: [flexcoders] Re: Selecting which Child Components to add at
runtime
The order of items in HBox/VBox is their childIndex order.
addChildAt(myButton , 0) should put it first.
From: [EMAIL PROTECTED] ups.com [mailto:flexcoders@
yahoogroups. com] On Behalf Of rough68fish
Sent: Tuesday, June 05, 2007 10:05
AM
To: [EMAIL PROTECTED] ups.com
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">
<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.getChildByNam e("associateRB" ) != null) {
this.removeChild( this.getChildByN ame("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.getChildByNam e("hostRB" ) != null) {
this.removeChild( this.getChildByN ame("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.getChildByNam e("arrivalRB" ) != null) {
this.removeChild( this.getChildByN ame("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.getChildByNam e("departureRB" ) != null) {
this.removeChild( this.getChildByN ame("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.getChildByNam e("pArrivalRB" ) != null) {
this.removeChild( this.getChildByN ame("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.getChildByNam e("pDepartureRB" ) != null) {
this.removeChild( this.getChildByN ame("pDepartureR B"));
}
}
}
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.getChildByNam e("associateRB" ) != null) {
RadioButton( this.getChildByN ame("associateRB ")).selected = true;
}
}
]]>
</mx:Script>
<mx:RadioButtonGrou p id="orderByGrp" />
<!--mx:RadioButton id="associateRB" groupName="orderByG
rp"
label="Associate Name"
value="Associate" visible="{this. showAssociate} "
selected="true" /-->
<!--mx:RadioButton id="hostRB" groupName="orderByG rp"
label="Host
Name"
value="Host" visible="{this. showHost} "/-->
<!--mx:RadioButton id="arrivalRB" groupName="orderByG
rp"
label="Arrival Date"
value="Arrival" visible="{this. showArrival} "/-->
<!--mx:RadioButton id="departureRB" groupName="orderByG
rp"
label="Departure Date"
value="Departure" visible="{this. showDeparture} "/-->
<!--mx:RadioButton id="pArrivalRB" groupName="orderByG
rp"
label="Pending Arrival Date"
value="PArrival" visible="{this. showPArrival} "/-->
<!--mx:RadioButton id="pDepartureRB" groupName="orderByG
rp"
label="Pending Departure Date"
value="PDeparture" visible="{this. showPDeparture} "/-->
</mx:HBox>
--- In [EMAIL PROTECTED]
ups.com, "rough68fish" <rough68fish@ ...>
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]
ups.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.selected Item.label;
> > vsComps.addChild( canCustView) ;
> > }
> >
> >
> >
> > ...
> >
> > fAddCustomView( Comp1);
> >
> >
> >
> >
> >
> > ____________ _________ _________ __
> >
> > From: [EMAIL PROTECTED]
ups.com [mailto:[EMAIL PROTECTED] ups.com]
On
> > Behalf Of phall121
> > Sent: Monday, June 04, 2007 12:39 PM
> > To: [EMAIL PROTECTED]
ups.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.selected
Item.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> "
> > 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.selected Item.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="fAddCustomVi ew()"/>
> >
> > <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"
verticalScrollPolic y="off"
> > horizontalScrollPol icy="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>
> >
>
Shape Yahoo! in your own image. Join
our Network Research Panel today!
<!--
#ygrp-mlmsg {font-size:13px;font-family:arial, helvetica, clean, sans-serif;}
#ygrp-mlmsg table {font-size:inherit;font:100%;}
#ygrp-mlmsg select, input, textarea {font:99% arial, helvetica, clean,
sans-serif;}
#ygrp-mlmsg pre, code {font:115% monospace;}
#ygrp-mlmsg * {line-height:1.22em;}
#ygrp-text{
font-family:Georgia;
}
#ygrp-text p{
margin:0 0 1em 0;}
#ygrp-tpmsgs{
font-family:Arial;
clear:both;}
#ygrp-vitnav{
padding-top:10px;font-family:Verdana;font-size:77%;margin:0;}
#ygrp-vitnav a{
padding:0 1px;}
#ygrp-actbar{
clear:both;margin:25px 0;white-space:nowrap;color:#666;text-align:right;}
#ygrp-actbar .left{
float:left;white-space:nowrap;}
.bld{font-weight:bold;}
#ygrp-grft{
font-family:Verdana;font-size:77%;padding:15px 0;}
#ygrp-ft{
font-family:verdana;font-size:77%;border-top:1px solid #666;
padding:5px 0;
}
#ygrp-mlmsg #logo{
padding-bottom:10px;}
#ygrp-vital{
background-color:#e0ecee;margin-bottom:20px;padding:2px 0 8px 8px;}
#ygrp-vital #vithd{
font-size:77%;font-family:Verdana;font-weight:bold;color:#333;text-transform:uppercase;}
#ygrp-vital ul{
padding:0;margin:2px 0;}
#ygrp-vital ul li{
list-style-type:none;clear:both;border:1px solid #e0ecee;
}
#ygrp-vital ul li .ct{
font-weight:bold;color:#ff7900;float:right;width:2em;text-align:right;padding-right:.5em;}
#ygrp-vital ul li .cat{
font-weight:bold;}
#ygrp-vital a {
text-decoration:none;}
#ygrp-vital a:hover{
text-decoration:underline;}
#ygrp-sponsor #hd{
color:#999;font-size:77%;}
#ygrp-sponsor #ov{
padding:6px 13px;background-color:#e0ecee;margin-bottom:20px;}
#ygrp-sponsor #ov ul{
padding:0 0 0 8px;margin:0;}
#ygrp-sponsor #ov li{
list-style-type:square;padding:6px 0;font-size:77%;}
#ygrp-sponsor #ov li a{
text-decoration:none;font-size:130%;}
#ygrp-sponsor #nc {
background-color:#eee;margin-bottom:20px;padding:0 8px;}
#ygrp-sponsor .ad{
padding:8px 0;}
#ygrp-sponsor .ad #hd1{
font-family:Arial;font-weight:bold;color:#628c2a;font-size:100%;line-height:122%;}
#ygrp-sponsor .ad a{
text-decoration:none;}
#ygrp-sponsor .ad a:hover{
text-decoration:underline;}
#ygrp-sponsor .ad p{
margin:0;}
o {font-size:0;}
.MsoNormal {
margin:0 0 0 0;}
#ygrp-text tt{
font-size:120%;}
blockquote{margin:0 0 0 4px;}
.replbq {margin:4;}
-->
____________________________________________________________________________________
Park yourself in front of a world of choices in alternative vehicles. Visit the
Yahoo! Auto Green Center.
http://autos.yahoo.com/green_center/