How to show different images for a single button?

How to开发者_JAVA百科 show different images for a single button?

It should show different images when the mouse pointer is over the button and out of the button.

<mx:Button label="test" downIcon="@Embed('assets/downIcon.png')" upIcon="@Embed('assets/upIcon.png')" />

see livedocs

I don't think there is a easy way to do it. Up to know i have chosen one of the following: 1. either write your own object, where you set event handlers to swap the image or 2. make a flash with bubbling event, and embed/load it in flex, where you catch the event (communicating between a swf from flash and flex is quite a pain, so events seem to do it)

I can provide code if you are interested in any of those two methods

UPDATE:

here's the code to the easiest way. Just add the two images:

 package {

 import flash.display.MovieClip;
 import flash.display.Sprite;
 import flash.events.MouseEvent;

   public class Test extends Sprite {

    [Embed(source="image1.png")]
    private var Image1:Class;
    [Embed(source="image2.png")]
    private var Image2:Class;


  public function Test() {
        var theHolderMC:MovieClip = new MovieClip();
        addChild(theHolderMC);

        theHolderMC.addChild(new Image2());
        theHolderMC.addChild(new Image1());

        theHolderMC.addEventListener(MouseEvent.CLICK, swap)
   }

   private function swap(e:MouseEvent):void{
        var holder:MovieClip = MovieClip(e.target);
        holder.swapChildren(holder.getChildAt(0), holder.getChildAt(1));
        // or alternatively, you can make them .visible=false or any other way you want. 
   }


}
}

The method you choose for this task depends on your exact circumstance. The simplest way of implementing mouseover buttons doesn't involve any code; within Flash you simply define a mouseover image in the button symbol.