问题
I have a Canvas in a Flex application which has items inside it that cover only about 50% of the area of the main canvas.
i want the canvas to respond to rollOver events for the full area, and not just the area that is covered by the items inside.
I have been setting the following attributes to achieve this :
<mx:Canvas backgroundColor="white"
backgroundAlpha=".01"
rollOver="rollOver(event)">...
This causes the entire canvas to respond to rollOver events. It works great - I'm just not happy with it and figure there must be a better way to achieve it.
Is there a way to force mouse events to act on the entire area of a UIComponent?
回答1:
What you are doing is perfectly acceptable, although using the arbitrary alpha value of 0.01 is unnecessary, you can set it's backgroundAlpha to a simple 0.
I routinely use Canvases for complicated multi layered UI's and set up my default Canvas style via css to have a backgroundAlpha of 0 and a backgroundColor of #ffffff, then, if I need a canvas to actually be visible I adjust it's individual backgroundAlpha and backgroundColor properties.
There's nothing wrong with setting a graphic object's alpha to 0 so that it still responds to events but hasn't been 'turned off' entirely, us AS coders do it all the time!
回答2:
What about ignoring transparency sections of an image? In my case I would like the roll over effect to occur only if the visible section of an image is rolled over, not the transparent part. Is this possible?
回答3:
You could do this:
import flash.event.MouseEvent;
...
canvas.addEventListener(MouseEvent.ROLL_OVER,function(event:MouseEvent):void {
...
});
where "canvas" is the ID of the canvas in your mxml.
来源：https://stackoverflow.com/questions/291927/correct-way-in-flex-to-make-a-transparent-panel-respond-to-rollover-events