Forums

I am trying to make a combo box with variable height items which i have managed to do by writing this:

<comboBox:MCComboBox
            id="comboBox"
            prompt="{_prompt}"
            maxWidth="{container.width}" 
            itemRenderer="{new ClassFactory(MCComboBoxItemRenderer)}"
            dataProvider="{_dataProvider}"
            change="_updateAnswerVO(event)"
            open="_openComboBoxHandler(event)"/>

private function _openComboBoxHandler(e:DropdownEvent):void {
                var list:List = e.currentTarget.dropdown
                list.wordWrap = true;
                list.variableRowHeight = true;
                list.height = list.measureHeightOfItems();
            }

This is being displayed properly.  With some minor glitches for the positioning and the height of the dropdown.

The problem is with displaying this selected item

i've created a custom combo box that uses the item renderer class as its display instead of textInput

protected var textInputReplacement:UIComponent;
           
            override public function set itemRenderer(value:IFactory):void {
                super.itemRenderer = value;
                createChildren();
            }
            override protected function createChildren():void {
                super.createChildren();
               
                if ( !textInputReplacement ) {
                    if ( itemRenderer != null ) {
                        //remove the default textInput
                        removeChild(textInput);
                       
                        //create a new itemRenderer to use in place of the text input
                        textInputReplacement = itemRenderer.newInstance();
                        textInputReplacement.mouseEnabled = textInputReplacement.mouseChildren = false;
                        BindingUtils.bindProperty(textInputReplacement, "data", this, "selectedItem", true);
                        addChild(textInputReplacement);
                    }
                }
            }
            override public function set prompt(value:String):void {
                super.prompt = value;
            }
            override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
                super.updateDisplayList(unscaledWidth, unscaledHeight);
               
                if ( textInputReplacement ) {
                    textInputReplacement.width = unscaledWidth;
                    textInputReplacement.height = unscaledHeight;
                }
            }
            override public function set selectedIndex(value:int):void {
                super.selectedIndex = value;
                if (textInputReplacement && textInputReplacement.height)
                    height = textInputReplacement.height;
            }

The problem is I can't get the height of the combobox to adjust itself based on the selected answer since it seems to be a fixed height, how can i set it to the actual itemRenderer's height and not the container's?