Casting with getChildAt

Report · May 18, 2009

Hi there,

I have a loop adding elements onto the stage. I want to use getChildAt to listen for a CheckBox event.Change method, then change the visible property of a ComboBox.

I have read some things about having to wrap the object in its origional type, but am having issues. any help would be much appreciated.

          private function createLayout():void {
               container = new VBox();
               
               for(var i:int=0; i<listCollection.length; i++) {
                    vBox = new VBox();
                    hBox = new HBox();
                    titleText = new LinkButton();
                    itemInfo = new Text();
                    abstract = new Text();
                    archive = new CheckBox();
                    rateItem = new ComboBox();
                    category = new ComboBox();
                    var categoryLabels:Array = new Array("Food & Ag","News","Health","People","General","What's Coming","Biofuel","Environment");
                    var rateLabels:Array = new Array("Excellent","Good","Bad","Neutral","Controversial");

                    titleText.label = listCollection.getItemAt(i).title;
                    titleText.width = 400;
                    itemInfo.text = listCollection.getItemAt(i).source + " | " + listCollection.getItemAt(i).date;
                    abstract.text = listCollection.getItemAt(i).abstract;
                    abstract.width = 400;
                    archive.label = "Archive";
                    
                    category.prompt = "Category";
                    category.name = "category";
                    category.dataProvider = categoryLabels;
                    category.rowCount = categoryLabels.length;
                    category.visible = false;
                    category.includeInLayout = false;

                    rateItem.prompt = "Rate";
                    rateItem.name = "rateItem";
                    rateItem.dataProvider = rateLabels;
                    rateItem.visible = false;
                    rateItem.includeInLayout = false;
                    
                    vBox.addChild(titleText);
                    vBox.addChild(itemInfo);
                    vBox.addChild(abstract);
                    vBox.addChild(hBox);
                    
                    hBox.addChild(archive);     
                    hBox.addChild(category);
                    hBox.addChild(rateItem);
                    
                    hBox.percentWidth = 80;
                    hBox.percentHeight = 80;
                    archive.addEventListener(Event.CHANGE, toggleArchive);     
                                   
                    container.addChild(vBox);
               }
               
               addChild(container);

          }

listen for

archive.addEventListener(Event.CHANGE, toggleArchive);

where I'm having the issue

          public function toggleArchive(e:Event):void {
               var archive2:CheckBox = CheckBox(archive.getChildAt(i));
               trace(archive2.label);
               
             /* if(archive.selected == true){
                   trace("approved");
                 // (ComboBox(rateItem).getChildAt(i)).visible = true;
                 // (ComboBox(rateItem).getChildAt(i)).includeInLayout = true;
              }
          
               else {
                    trace("test");
               } */
          }

error I am getting

TypeError: Error #1034: Type Coercion failed: cannot convert mx.skins.halo::CheckBoxIcon@25e1ee21 to mx.controls.CheckBox.
     at components::listItems/toggleArchive()[/Volumes/Files/Canulla/Brodeur/prof_dev/mediaTrap/src/components/listItems.mxml:131]
     at flash.events::EventDispatcher/dispatchEventFunction()
     at flash.events::EventDispatcher/dispatchEvent()
     at mx.core::UIComponent/dispatchEvent()
     at mx.controls::Button/http://www.adobe.com/2006/flex/mx/internal::setSelected()
     at mx.controls::Button/clickHandler()

Thanks in advance for any help!

Ryan

Report · May 18, 2009

first, if listCollection.length>1, you have name collisions. for example, there are more than one rateItem comboboxes and you have no easy way to distinguish one from another. they should be given different object references and/or different name properties.

2nd, it's not clear where i that's used in toggleArchive() is defined. but if it has anything to do with the variable i used in your for-loop, you have a problem. i will be equal it listCollection.length when the for-loop completes and will still have that value when toggleArchive is called unless it's changed elsewhere.

and finally, it's not clear what children the rateItem comboxes have.

are you really trying to control the ith created combobox in toggleArchive()?

Report · May 18, 2009

they should be given different object references and/or different name properties.

Can you explain this a bit? So are you saying that I should have the loop name them differintly?

2nd, it's not clear where i that's used in toggleArchive() is defined. but if it has anything to do with the variable i used in your for-loop, you have a problem. i will be equal it listCollection.length when the for-loop completes and will still have that value when toggleArchive is called unless it's changed elsewhere.

Unfortunalty that was what I was trying. Can you please steer me in the right direction. The idea would be that the for loop would create items from a news feed. If the user checks the checkbox (archive) then two comboboxes would appear for them to add a rating/category that the item falls into. I was trying to add an eventListener to the checkBox and call the toggle function accordingly to se tthe visible properties to true.

and finally, it's not clear what children the rateItem comboxes have.

I am not sure what you are asking. Sorry I am not that saavy in as3.

are you really trying to control the ith created combobox in toggleArchive()?

that was the idea, can you please point me in the right direction as to the correct way to do something liek this in AS3? I would love to do some reading if possible!

THANK YOU very much for all of your help. I can appreciate someone saying, whoa buddy your a mess here. Start over and do it this way!!

Thank you sir!

Report · May 18, 2009

typically you would use something like

tl["rateItem"+i]=new ComboBox();

in your for-loop where tl references the current timeline.

or you could use the name properties of your comboboxes:

rateItem.name = "rateItem"+i;

and then you would use getChildByName() to get an object reference from the name property.

but in your situation you can just assign a property to each checkbox so it knows the rateItem combobox created during its particular loop:

archive.rateItem = rateItem; // in your for-loop.

then in your archive listener toggleArchive you could use:

ComboBox(e.currentTarget.rateItem).visible = true;

Report · May 19, 2009

The following should work:

   //-------------------------------------------------------------------------
   // createLayout()
   //-------------------------------------------------------------------------
   private function createLayout():void {
    trace("Application ::: createLayout");
    
    var container:VBox = new VBox();
    
    var vBox:VBox;
    var hBox:HBox;
    var titleText:LinkButton;
    var itemInfo:Text;
    var abstract:Text;
    var archive:CheckBox;
    var rateItem:ComboBox;
    var category:ComboBox;
    
    var categoryLabels:Array = new Array("Food & Ag","News","Health","People","General","What's Coming","Biofuel","Environment");
    var rateLabels:Array = new Array("Excellent","Good","Bad","Neutral","Controversial");
    
    var len:int = listCollection.length;
    var item:Object;
    
    for(var i:int=0; i<listCollection.length; i++) {
     
     item = listCollection.getItemAt(i);
     
     vBox = new VBox();
     hBox = new HBox();
     
     titleText = new LinkButton();
     itemInfo = new Text();
     abstract = new Text();
     archive = new CheckBox();
     rateItem = new ComboBox();
     category = new ComboBox();
      
     titleText.label = item.title;
     titleText.width = 400;
     itemInfo.text = item.source + " | " + item.date;
     abstract.text = item.abstract;
     abstract.width = 400;
     archive.label = "Archive";
     archive.addEventListener(Event.CHANGE, toggleArchive);     
     
     category.prompt = "Category";

     category.dataProvider = categoryLabels;
     category.rowCount = categoryLabels.length;
     category.visible = false;
     category.includeInLayout = false;
      
     rateItem.prompt = "Rate";
     rateItem.dataProvider = rateLabels;
     rateItem.visible = false;
     rateItem.includeInLayout = false;
     
     vBox.addChild(titleText);
     vBox.addChild(itemInfo);
     vBox.addChild(abstract);
     vBox.addChild(hBox);
     
     hBox.addChild(archive); 
     hBox.addChild(category);
     hBox.addChild(rateItem);
     
     hBox.percentWidth = 80;
     hBox.percentHeight = 80;
     container.addChild(vBox);
    }
    
    addChild(container);
     
   }
   
   //-------------------------------------------------------------------------
   // toggleArchive()
   //-------------------------------------------------------------------------
   private function toggleArchive(evt:Event):void {
    trace("Application ::: toggleArchive");
    var chb:CheckBox = evt.currentTarget as CheckBox;
    var hBox:HBox = chb.parent as HBox;
    trace("    - parent: ", hBox);
    var len:int = hBox.numChildren;
    for(var i:int=0; i<len; i++) {
     var cb:DisplayObject = hBox.getChildAt(i);
     if((cb is ComboBox)) {
      // toogle visibility and include in layout
      (cb as ComboBox).visible = chb.selected;
      (cb as ComboBox).includeInLayout = chb.selected;
     }
    }
   }

You can get the selected checkbox through the event argument (evt.currentTarget).

Since the CheckBox and ComboBoxes are in the same container (HBox), you can get a reference to that container by using: checkbox.parent

Once you know the parent, just cycle through its children to find the comboboxes and do whatever needs to be done.

With this approach, there's no need to "name" any of the comboboxes, just use the available framework API (numChildren, getChildAt())

I've moved the Arrays out of the for() loop as there's no need to create them with each iteration.