flex按钮使用背景图片

基于美化的需要，有时候我会被要求给按钮贴上图片

?

下面以flex4中使用mx:Button为例：

-----------------------------------------

<?xml version="1.0" encoding="utf-8"?>
<s:VGroup xmlns:fx="http://ns.adobe.com/mxml/2009"
??? ??? ? xmlns:s="library://ns.adobe.com/flex/spark"
??? ??? ? xmlns:mx="library://ns.adobe.com/flex/mx"
??? ??? ? creationComplete="init()"
??? ??? ? width="100%" height="100%">
??? <fx:Declarations>
??? ??? <!-- 将非可视元素（例如服务、值对象）放在此处 -->
??? </fx:Declarations>
??? <fx:Style >
??? ??? @namespace s "library://ns.adobe.com/flex/spark";
??? ??? @namespace mx "library://ns.adobe.com/flex/mx";
??? ??? .myCustomButton {
??? ??? ??? overSkin:Embed(source="styles/assets/submitBtn.gif");
??? ??? ??? upSkin:Embed(source="styles/assets/submitBtn.gif");
??? ??? ??? downSkin:Embed(source="styles/assets/submitBtn.gif");
??? ??? }
??? </fx:Style >
??? <fx:Script >
??? ??? <![CDATA[

??? ??? ??? import flash.events.MouseEvent;

??? ??? ???
??? ??? ??? import mx.controls.Alert;
??? ??? ??? import mx.events.CloseEvent;

??? ??? ???
??? ??? ???
??? ??? ??? private function init():void{
??? ??? ??? ??? ??? saveBtn.addEventListener(MouseEvent.CLICK,function():void{
??? ??? ??? ??? ??? ??? //提交这里是调用html页面上的test函数进行具体业务操作
??? ??? ??? ??? ??? ??? ExternalInterface.call("test","0");

???????????????????????
??? ??? ??? ??? ??? });
??? ??? ??? ???
??? ??? ??? }
??? ??? ??
??? </fx:Script >
??? <s:HGroup ><mx:Spacer/></s:HGroup>
??? <s:HGroup >
??? ??? <mx:Spacer/>
??? ??? <mx:Button label="" styleName="myCustomButton" id="saveBtn" useHandCursor="true" buttonMode="true" width="80" height="25"/>
??? </s:HGroup>
</s:VGroup>

?

这里按钮禁用时图片好像是不能显示出来