How to apply image states in spark dropdownlist
I have a spark d开发者_如何学Cropdownlist and I have applied custom skin on it to display images in it instead of labels.
<s:DropDownList id="id_cbLineType"
skinClass="assets.skins.SkinDropDownImageList"
itemRenderer="spark.skins.spark.DefaultComplexItemRenderer"
width="32"
selectedIndex="0"
borderAlpha="1"
change="OnLineTypeChange(event)">
<s:dataProvider>
<s:ArrayList>
<mx:Image source="@Embed('assets/images/mainToolbars/Straight.png')" />
<mx:Image source="@Embed('assets/images/mainToolbars/Curved.png')" />
<mx:Image source="@Embed('assets/images/mainToolbars/Angular.png')" />
</s:ArrayList>
</s:dataProvider>
</s:DropDownList>
I have applied custom skin to show images. Now I want to show different images for up, over, down and disables states on these images. Is there any way to do that?
You need to create a custom item renderer with those states and display the images. You wouldn't need to use the images in the data provider, the the image data itself, the item renderer would do the rest.
You should be able to implement the up/over/down/disabled states in your itemRenderer. You'll need to pass in all the images, so you'll probably have to change your dataProvider. I'd create it in ActionScript instead of MXML. I'd also use an object instead of an Image. You can create your own custom object.
But conceptually something like this:
public var dp : ArrayCollection = new ArrayCollection([
{upImage='assets/images/mainToolbars/Straight.png',downImage=,'assets/images/mainToolbars/Straight.png',disabledImage='assets/images/mainToolbars/Straight.png',overImage='assets/images/mainToolbars/Straight.png'},
]);
That will be passed into your itemRenderer as the data property and then you can use them to style your itemRenderer.
Since you are embedding images instead of just linking to them; youll have to do slightly more than the strings I'm using in the above sample.
精彩评论