CODEWITHSUNDEEP
flashactionscript-3
mattstuehler
mattstuehler

Reputation: 9292

Flash AS3: How to prevent MouseEvent.MOUSE_OUT when you mouse_over a child sprite

All,

Here's my situation...

The UI of my Flash application is a grid. Each row of the grid is a sprite that contains a number of child sprites (UI controls) that respond to mouse events

Each row of the grid should have a hover effect - i.e., when you hover over the row, the row's background should change color.

This is accomplished easily:

rowSprite.addEventListener(MouseEvent.MOUSE_OVER, highlightRow, false, 0, true);
rowSprite.addEventListener(MouseEvent.MOUSE_OUT, unhighlightRow, false, 0, true);

This works fine, EXCEPT that when the user rolls over any of the row's child sprites, the row's MOUSE_OUT event is fired, and the row is "unhighlighted". This isn't what I want.

In other words - I'd like the row to be unhighlighted only when you roll OUTSIDE of the row, not when you roll over a child sprite within the row.

A possible solution: in the unhighlightRow function, test whether the user's mouse position is still within the row sprites bounds. But I'm guessing that's not the most elegant or efficient solution.

This must be an incredibly common problem. What's the best solution?

Thanks in advance!

Upvotes: 3

Views: 6004

Answers (4)

eLouai
eLouai

Reputation: 696

To disable the children from receiving mouse events set. That would fix your problem:

rowSprite.mouseChildren = false;

Upvotes: 0

Armen Michaeli
Armen Michaeli

Reputation: 9140

Yes, it is a very common problem, and Adobe have provided a solution.

You can use the mouseChildren property - set it to false to prevent children generating (yes, generating) mouse related events, which in your case will rid you from unwanted mouseOut events as there would be no correspoding mouseOver event generated when your cursor enters a childs area.

mouseChildren is available for DisplayObjectContainer objects.

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/display/DisplayObjectContainer.html#mouseChildren

Upvotes: 2

Lars Blåsjö
Lars Blåsjö

Reputation: 6127

You can use ROLL_OVER and ROLL_OUT instead of MOUSE_OVER and MOUSE_OUT in such cases:

http://kinderas.blogspot.com/2008/12/quicktip-mouseover-vs-rollover.html

Upvotes: 7

Lucas
Lucas

Reputation: 578

rowSprite.addEventListener(MouseEvent.MOUSE_OVER, highlightRow, false, 0, true);
rowSprite.addEventListener(MouseEvent.MOUSE_OUT, unhighlightRow, false, 0, true);

function unhighlightRow (e:MouseEvent):void {
   if(Sprite(e.target).contains(e.currentTarget)) {
      return
   }
}

didn't test it but it should work

Upvotes: 0

Related Questions