Apache flex 带有图标的Flex 4.6下拉列表

我有一些问题做一个简单的下拉列表与图标左侧的条目。 我已经完成了itemRenderer部分，所以当我打开dropdownlist时，一切都很好。我的主要皮肤有问题：

<s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" 
xmlns:fb="http://ns.adobe.com/flashbuilder/2009" alpha.disabled=".5"> 

<!-- host component -->
<fx:Metadata>
<![CDATA[ 
    /** 
     * @copy spark.skins.spark.ApplicationSkin#hostComponent
     */
    [HostComponent("spark.components.DropDownList")]
]]>
</fx:Metadata> 

<fx:Script fb:purpose="styling">
    <![CDATA[            

        /* Define the content fill items that should be colored by the "contentBackgroundColor" style. */
        static private const contentFill:Array = ["bgFill"];

        /**
         * @private
         */
        override public function get contentItems():Array {return contentFill};
                    /**
         * @private
         */
        override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
        {
            if (getStyle("borderVisible") == false)
            {
                if (border)
                    border.visible = false;
                if (background)
                {
                    background.left = background.top = background.right = background.bottom = 0;
                }
                if (scroller)
                    scroller.minViewportInset = 0;
            }
            else
            {
                if (border)
                    border.visible = true;
                if (background)
                {
                    background.left = background.top = background.right = background.bottom = 1;
                }
                if (scroller)
                    scroller.minViewportInset = 1;
            }

            if (dropShadow)
                dropShadow.visible = getStyle("dropShadowVisible");

            openButton.setStyle("cornerRadius", getStyle("cornerRadius"));

            if (borderStroke)
            {
                borderStroke.color = getStyle("borderColor");
                borderStroke.alpha = getStyle("borderAlpha");
            }
            super.updateDisplayList(unscaledWidth, unscaledHeight);
        }
    ]]>
</fx:Script>

<s:states>
    <s:State name="normal" />
    <s:State name="open" />
    <s:State name="disabled" />
</s:states>

<!--- 
    The PopUpAnchor control that opens the drop-down list. 

    <p>In a custom skin class that uses transitions, set the 
    <code>itemDestructionPolicy</code> property to <code>never</code>.</p>
-->
<s:PopUpAnchor id="popUp"  displayPopUp.normal="false" displayPopUp.open="true" includeIn="open"
    left="0" right="0" top="0" bottom="0" itemDestructionPolicy="auto"
    popUpPosition="below" popUpWidthMatchesAnchorWidth="true">

    <!--- 
          This includes borders, background colors, scrollers, and filters.
          @copy spark.components.supportClasses.DropDownListBase#dropDown
    -->
    <s:Group id="dropDown">

        <!--- @private -->
        <s:RectangularDropShadow id="dropShadow" blurX="20" blurY="20" alpha="0.45" distance="7" 
             angle="90" color="#000000" left="0" top="0" right="0" bottom="0"/>

        <!--- @private -->
        <s:Rect id="border" left="0" right="0" top="0" bottom="0">
            <s:stroke>
                <!--- border stroke @private -->
                <s:SolidColorStroke id="borderStroke" weight="1"/>
            </s:stroke>
        </s:Rect>

        <!-- fill -->
        <!--- Defines the appearance of drop-down list's background fill. -->
        <s:Rect id="background" left="1" right="1" top="1" bottom="1" >
            <s:fill>
            <!---  
                The color of the drop down's background fill.
                The default color is 0xFFFFFF.
            -->
                <s:SolidColor id="bgFill" color="0xFFFFFF" />
            </s:fill>
        </s:Rect>

        <!--- @private -->
        <s:Scroller id="scroller" left="0" top="0" right="0" bottom="0" hasFocusableChildren="false" minViewportInset="1">
            <!--- @copy spark.components.SkinnableDataContainer#dataGroup-->
            <s:DataGroup id="dataGroup" itemRenderer="spark.skins.spark.DefaultItemRenderer">
                <s:layout>
                    <s:VerticalLayout gap="0" horizontalAlign="contentJustify" requestedMinRowCount="1" requestedMaxRowCount="6"/>
                </s:layout>
            </s:DataGroup> 
        </s:Scroller>
    </s:Group>
</s:PopUpAnchor>

<!---  The default skin is DropDownListButtonSkin. 
        @copy spark.components.supportClasses.DropDownListBase#openButton
        @see spark.skins.spark.DropDownListButtonSkin -->
<s:Button id="openButton" left="0" right="0" top="0" bottom="0" focusEnabled="false" tabEnabled="false"
    skinClass="spark.skins.spark.DropDownListButtonSkin" />  

<!--- @copy spark.components.DropDownList#labelDisplay 
<s:Label id="labelDisplay" verticalAlign="middle" maxDisplayedLines="1" 
    mouseEnabled="false" mouseChildren="false"
    left = "7" right = "30" top = "2" bottom = "2" width = "75" verticalCenter = "1" / > -->

<s:HGroup left="5" right="30" top="2" bottom="2" verticalAlign="middle" verticalCenter="1" paddingTop="5" paddingBottom="5">
    <s:BitmapImage id="bitmapIcon" top="0" width="34" height="34" source="{hostComponent.selectedItem.icon}"/>
    <s:Label id="labelDisplay" verticalAlign="middle" maxDisplayedLines="1" mouseEnabled="false" mouseChildren="false" left="3" right="30" top="2" bottom="2" verticalCenter="1" />
</s:HGroup>

重要的部分是：

<s:HGroup left="5" right="30" top="2" bottom="2" verticalAlign="middle" verticalCenter="1" paddingTop="5" paddingBottom="5">
    <s:BitmapImage id="bitmapIcon" top="0" width="34" height="34" source="{hostComponent.selectedItem.icon}"/>
    <s:Label id="labelDisplay" verticalAlign="middle" maxDisplayedLines="1" mouseEnabled="false" mouseChildren="false" left="3" right="30" top="2" bottom="2" verticalCenter="1" />
</s:HGroup>

“hostComponent.selectedItem.icon”在flex 4.6中不再工作，我有以下警告： 警告：无法绑定到类“Object”（类不是IEventDispatcher）上的属性“icon”）

---

我不知道如何通过其他方式设置值…

好的，我想我知道了

例如，我必须创建一个自定义类DropDownListIcon，带有一个[Bindable]公共变量图标：Class

我覆盖selectedItem并设置图标

override public function set selectedItem(value:*):void
    {
        super.selectedItem = value;
        if ( value ) icon = value.icon;
    }

在DropDownListSkin中，我从主机组件获取图标

 <s:BitmapImage id="bitmapIcon" top="0" width="34" height="34" source="{hostComponent.icon}"/>