flex combobox arrow custom image

Question

Hi all,

In my Flex AIR application I have to customize the Combobox with custom arrow icon. I got the properties to change its color but didn't get any property to change the icon itself. After Googling I got some links of skinning the combobox but they were for FLASH CS4, but I am on Flex.

Not getting any solution. Please help.

Thanks in advance.

Here is the code:

<?xml version="1.0" encoding="utf-8"?><mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Style>
    ComboBox {
        up-skin :  Embed(source="Pulldown_def.png");
        down-skin : Embed(source="Pulldown_def.png");
        over-skin : Embed(source="Pulldown_def.png");       
    }
</mx:Style>
<mx:Array id="dp">
    <mx:Object label="test1" />
    <mx:Object label="test2" />
</mx:Array>
<mx:ComboBox id="cbx" x="51" y="43" dataProvider="{dp}" labelField="label" ></mx:ComboBox>

It is not working for me :( It applies the image over whole Combobox. I need to replace the arrow image. Am I doing anything wrong?

Answer 1

You can create a custom skin and set the skin, upSkin, downSkin and overSkin style attributes of the ComboBox to that class. The default value is ComboBoxArrowSkin