Flex 4:Capturing mouse events with spark.primitive.path objects

Question

I am trying to capture mouse events whenever the mouse does something over top of a spark.primitive.path (the 'L' shape below).

Everything I have read states that I need to put the path inside of a Group object and attach mouse handlers to that. So the code would look something like this..

  <s:Group left="10" right="10" top="10" bottom="10" mouseOver="...">
    <s:Path data="M 100 300 L 200 50 L 275 50 L 250 150 L 300 150 L 300 300 Z">                    
            <s:stroke>
                <s:SolidColorStroke color="0x888888"/>
            </s:stroke>
        </s:Path>
  </s:Group>

...and produces something like this on screen (please forgive the ascii art)

_____________________________
|                           |
|             _______       |
|            /      /       |
|           /      /        |
|          /      /         |
|         /      /_____     |
|        /            |     |
|       /             |     |
|      /______________|     |
|                           |
-----------------------------

This does almost work. The problem is the mouse events are fired based on dimensions of the Group object, not the Path. So, if you mouse over to the left of the path that still fires mouse events, because the Group is a box starting at 0,0 and ending at the bottom right side of the 'L'.

Any thoughts on how I can resolve this (or an alternate solution) are greatly appreciated.

Answer 1

If you use a SkinnableContainer instead of a Group, you will get the behavior you are looking for.