Sometimes to achieve visual effects you have to overlay gradients on top of UI controls. For example, putting a gradient on top of a form might make the form look like its under a glass pane. If you have ever tried anything like this the first thing you would notice is that mouse events are captured by the overlay image and your controls are all blocked.
I have done this a few times and found that setting mouseEnabled=false did the trick...sometimes. I never knew exactly what was going on with those other times until just now. When using embedded assets for an overlay you have to set mouseChildren=false as well! Using css styling or the drawing API to make lightweight gradients works fine. Embedded assets with objects like Image or VBox have containers internally that hold graphics and those need to be told to ignore mouse events. The simple fix is to have both mouseEnabled and mouseChildren set to false in order to disable everything.
Here are some code examples to demonstrate. Notice that a VBox with a background color works as an overlay with only mouseEnabled=false, but a VBox with an embedded backgroundImage needs mouseChildren=false as well. You would probably never use a VBox this way, but this helps get the point across (right-click for source).
dude, this is EXACTLY what I just needed.
that’s an awesome example! I’ve been playing with flex trying to get it to do exactly this.
Thanks!
THANK YOU!
oh dude, your simple 2 statements saved my couple of hours, thanks
Nice work! I’ll have to do a cross post on this one
you rock. talk about a time saver. the more i use flex, even with their third major build there are SO many inconsistencies that are staggering in their importance but almost entirely absent from Adobe’s documentation. thx a ton
THANK YOU! I was trying hitArea to null… and that didn’t work, so this was exactly what i needed. Thank you again.
Great little snippet, thanks for taking the time to post this what now seems simple solution to my problem!
THANK YOU!
great post! just what i needed.
The srcview is showing up as a 404: http://9mmedia.com/blog/srcview/index.html