Flex组合框中显示项目的自定义项目渲染器

Question

我在组合框中使用自定义项呈示器来显示自定义绘图而不是默认文本标签.

这适用于下拉列表,但显示的项目(当列表关闭时)仍然是我的对象的文本表示.

有没有办法让显示的项目与下拉列表中的项目呈现方式相同？

Answer 1

默认情况下,您无法执行此操作.但是,如果扩展ComboBox,则可以轻松添加此功能.这是一个简单的例子,它是一个粗略的版本,可能需要测试/调整,但它显示了如何实现这一目标.

package
{
    import mx.controls.ComboBox;
    import mx.core.UIComponent;

    public class ComboBox2 extends ComboBox
    {
        public function ComboBox2()
        {
            super();
        }

        protected var textInputReplacement:UIComponent;

        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();
                    addChild(textInputReplacement);
                }
            }
        }

        override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
            super.updateDisplayList(unscaledWidth, unscaledHeight);

            if ( textInputReplacement ) {
                textInputReplacement.width = unscaledWidth;
                textInputReplacement.height = unscaledHeight;
            }
        }
    }
}

Answer 2

我尝试了上面的解决方案,但发现当组合框关闭时,selectedItem没有显示.将itemRenderer数据属性绑定到selectedItem需要额外的代码行:

            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();

                            // ADD THIS BINDING:
                            // Bind the data of the textInputReplacement to the selected item
                            BindingUtils.bindProperty(textInputReplacement, "data", this, "selectedItem", true);

                            addChild(textInputReplacement);
                    }
            }