A couple years in now, there's still something about mouseEnabled I'm not getting. I have a Sprite (for example here "Sky", that contains many objects, one of them is a Cloud, which I do not want to receive Mouse Events. I overlay this Sky on some other display objects. I want the cloud to be visible, but not to block mouse events. If you see a tree through the clouds you should be able to click on the tree.
In the Sky class:
mouseEnabled = false;
cloud.mouseEnabled = false;
cloud.mouseChildren = false;
Even with this configuration, when the cloud is over the tree I can't click on the tree because the cloud blocks it. Why???
Even though Sky has mouseEnabled/mouseChildren set to false... it's still an object, it still takes up space, and therefore still acts as a hit area for any PARENT containers that don't have mouseEnabled/mouseChildren set to false.
Therefore, I suspect your Sky object is not in the same parent container as your Tree object. Your Sky object probably has its own parent container object, which is the culprit intercepting the events.
To elaborate: Any object that contains ANYTHING will have a hit area and will intercept mouse clicks, even though all the individual things it contains (shapes, child objects, etc.) may have mouseEnabled/mouseChildren set to false.
So even though your Sky object has mouseEnabled set to false, your Sky (and it's children) still take up space, and therefore still give Sky's parent container a hit area to intercept mouse events.
Your solution, therefore, is to make sure all the parent containers of Sky have thier mouseEnabled property set to false, at least up to (but not including) the first common ancestor container of the Tree and Sky objects.
Also, by setting mouseEnabled=false and leaving mouseChildren=true, you can have a container where only select children with mouseEnabled=true receive click events :)
You say there's "many objects" in there? More than likely something else is blocking it. I recommend adding a listener to the stage and then you can see which object is receiving clicks:
import flash.utils.getQualifiedClassName;
stage.addEventListener(MouseEvent.CLICK, onClick);
private function onClick(event:MouseEvent):void
{
trace(event.target.name, getQualifiedClassName(event.target));
}
Post more code and we can probably help more.
Related
I'm aware that addChild (1) adds the object into a display container object, and (2) shows the object in the DisplayObjectContainer. What I want to know is what happens when an object is added into a DisplayObjectContainer?
To summarize my question is (are),
Is there any magic happens when addChild invoked? i.e. Something is happening in, for example, DisplayObjectContainer.
Let's say, I have MovieClip A and B. B has A as part of it. I called addChild (A) in B. In MainTimeline and Stage, I don't call addChild (B). Visually, since B hasn't been added, A won't be there too. However, does A is exist (e.g. the memory allocated), even though it's not on the Stage?
I have searched here and there in SO, but humongous amount of the questions asked related to mine are technical. I greatly appreciate any answer or pointer regarding my questions
Here is simplified explanation of what happens.
When you create MovieClip A (or any object) using the new keyword (or if using FlashPro an item that exists on the timeline where the playhead is), that object is in memory. So whether or not MovieClip A is on the display list, it is taking up memory in your application.
When you use addChild, here are some of those things that happen (not necessarily in order):
If the object being added already has parentage, it is removed from that parent (though scale and position are kept, and will now be relative to the new parent).
Events are dispatched on the new parent (and the old parent if applicable). Event.ADDED and Event.ADDED_TO_STAGE + Event.REMOVED / REMOVED_FROM_STAGE on the old parent.
The parent(s) of the newly added object, will now take into account the new child/grandchild. Things like hit tests, and bounds, and mouse overs etc.
On the next frame tick (the stage's refresh rate), that item will be drawn
All that said, once a movieClip is on the display list, there is performance drain VS just having that object in memory - so if an object doesn't need to be seen, it's more efficient to have it off the display list until it needs to be seen.
If using FlashPro/Animate, you should also be aware that if through code you do anything that manipulates the parentage of a timeline display object (addChild/removeChild/setChildIndex etc), that timeline object will no longer be managed by the timeline. That means that if you have an empty keyframe to remove an item from the timeline, that item will actually stay on the screen until you either explicitly remove it (removeChild(item)) or it's parent goes away.
Im developing a flash game, and i would love to implement raining effect. Here's my progress on rain so far: http://www.squ4re.eu/Rain.html
The code is pretty simple; every raindrop is an object, when it hits the ground it places itself again at the top of the screen and adds splash animation.
But the problem is to click something BEHIND the rain. Lets say i have some selectable units at the battleground. In most cases an random raindrop interrupts selecting an object behind it. So here's my question: Is it possible in flash to create object "transparent" to mouse click, so i can click an object behind it? Or is there any other way to solve this problem?
Thank you in advance.
As #putvande mentioned, you could use mouseEnabled on every interactive object that should be disabled for mouse interaction. You also could create rainLayer and disable it for mouse interaction:
myRainLayer.mouseEnabled = false;
myRainLayer.mouseChildren = false;
mouseChildren - determines whether or not the children of the object are mouse, or user input device, enabled. If an object is enabled, a user can interact with it by using a mouse or user input device. The default is true.
Also consider to use display objects that don't inherit from InteractiveObject, like Bitmap, Shape and Video
I'm working on a game that uses mx canvases (each in their own mxml file) to wrap different aspects of the application. So the UI is wrapped in one canvas, the main game screen in another, and so on. I am having an issue where mouse input (specifically MouseEvent.CLICK, but it seems to apply to all mouse input) that I want to go to a movieClip in the GameScreen.mxml is being caught by an mx.core.FlexSprite object called "contentPane" that is a child of the GameUI.mxml.
This contentPane sprite doesn't exist when the GameUI object is instantiated, and in fact doesn't seem to exist until I set the text of some textFields contained by the GameUI. These textFields do overlap the movieClip that I want to receive the mouse input, but the textFields themselves are set to mouseEnabled = false, and are not catching the mouse input.
None of my code is directly creating this contentPane sprite, and some elementary Googling tells me that this contentPane sprite is created by the mx.flex.container internally. However, I can't seem to find any documentation on how this actually works, and what causes this sprite to be created.
This functionality has worked previously, and the only significant recent change I'm aware of is moving the swfs loaded into the GameUI into their own application domain to fix a namespace collision. I'm entirely prepared to believe that is the issue.
Ideally, I'd like to know why this contentPane is suddenly catching mouse input. Failing that, I'd at least like to find some documentation on how contentPane works, how I can manipulate it, and what causes its instantiation.
Thank you in advance for your help.
Edit:
I've done some additional digging and wanted to share what I've learned:
The contentPane variable is instantiated in mx.core.container objects for scrolling and clipping purposes. If the content of an mx.core.container object exceeds the size of that object, the container will create a contentPane and move its contents into that pane. However, if scrolling is disabled (verticalScrollPolicy="off" & horizontalScrollPolicy="off") and clipping is disabled (clipContent="false") then the container will not instantiate the contentPane. This solved my specific problem as I did not need either scrolling or clipping behavior in this container.
I would still like to know if there's a way to disable mouse input for an mx.core.container contentPane. It seems like there should be.
I have a DisplayObject docked at the top of my interface that displays debug information (frames per second, etc.) and is translucent with an alpha of 60%.
I would like to interact with items under this surface, such that when the mouse rolls over it, it dims to 10% alpha, and mouse events pass through it to the underlying objects.
Normally, I have this debug info panel's mouseEnabled and mouseChildren properties set to false, so objects under it receive mouse events.
The problem is that in order to hide it when the mouse rolls over it, it needs to have mouseEnabled set to true. However, if mouseEnabled is true, the mouse events are not picked up by objects underneath it.
As far as I know, I can't selectively enable mouseEvents, so it's either going to receive them all or none of them. That means that I'd have to handle and forward ALL events, if I took that approach.
I really wish the mouseEnabled property had a "peek" mode or something, so that it could receive the events if it is on top, but also allow them to pass through to objects underneath.
If a DisplayObject has mouseEnabled=true it means that its events will be sent to its container not to whateve is underneath the object. So this solution will not work. The best solution would be to reroute events from it manually using getObjectsUnderPoint as described here.
I've been using this approach for years in multi-touch apps. With multiple touch points I don't see any processor overhead. And you got only one cursor.
I feel your pain. Unfortunately, I don't know of a way to enable/disable specific mouse events. You could get creative with the solution though. For instance, maybe try adding a MOUSE_MOVE listener to your stage and track the coordinates of the mouse. Then, if the stageX,stageY of the mouse is in the area of your panel, set the visibility. You might also be able to use getObjectsUnderPoint() to determine which objects are under the mouse. But, my guess is that it would get a little intense on the processor to run that on each frame iteration.
I believe you are looking for mouseEnabled = false
But another last ditch attempt you can do is on mouse over move it to the other side of the screen.
One approach you can take, although not ideal, is to add an enter frame listener and check the mouse position every frame. something along the lines of:
stage.addEventListener(Event.ENTER_FRAME, onEnterFrame);
private function onEnterFrame(e:Event):void {
if(mouseX > width || mouseY > height){
//hide stats
}
}
I'm assuming you have this display hierarchy:
Debug Window
Debug Control 1
Debug Control 2
...
Overlay
Why not make the overlay a mask on DebugWindow and have your mouseEvents attached to DebugWindow itself? See this page for some inspiration: http://blog.shaperstudio.com/2010/11/as3-inverse-mask/
I had this same problem.. i made function to check is mouse over certain object:
public function isMouseOverObject(mPos: Point, pObject:DisplayObject, pContainer:DisplayObjectContainer) {
var under_objects:Array = pContainer.getObjectsUnderPoint(mPos);
var is_under:Boolean = false;
for (var i:int = 0; i < under_objects.length; i++) {
if (under_objects[i] == pObject) {
is_under = true;
break;
}
}
return is_under;
}
Before I go making major change in my ongoing game project, I just want to hear from others if anyone has found any issues with getObjectsUnderPoint() function of the DisplayObject?
Update:
Not just the performance issue but any other limitations of using it (like it doesn't detect certain type of UIelements (just as example))
I will have three layers in my application (which an Isometric game)
Background -- This is just a background which stays in the bottom, has nothing to do with game
Middle Layer -- This is the playable area, Here all my game elements will be placed on this layer
Top Layer -- This is one dummy transparent layer covers entire playable area which interrupts all the mouse events. This is where I want to use the getObjectsUnderPoint()
So, player wants to click on the element, the top layer will interrupt the mouseevent and then check if there is something placed or just a plain background and take appropriate action like, notify the underneath object.
This really doesn't require to be done this way because I could simply add moues events for all those items placed on the map directly but because I would be using getObjectsUnderPoint() anyway to check if there is anything beneath the item.
If anyone can explain how this function works then it would be little easy for me to make a decision.
There was one annoying problem though. I don't know if they fixed it or not. At least it was there in 10.1 times.
If you have a container and you scaled it container.getObjectsUnderPoint will return wrong result. All the time. So everywhere where I needed getObjectsUnderPoint I had to call it from stage to get proper result.
It's an incomplete function. It returns graphical objects under the mouse, NOT all potential mouse targets for event or interaction purposes. It actually requires complex logic to examine the array returned by getObjectsUnderPoint to determine the mouse target, because the appropriate target (the one Flash would choose if you actually clicked that point) may not be in the list.
First you'd have to examine the object array in reverse, since the items are ordered back to front. You'd have to examine each object's entire parent chain, looking for a parent with mouseChildren = false that would cause it to intercept the event and become the target. Whether or not such an object is found, this final object you arrive at must have its mouseEnabled property set to true, otherwise you must skip it and move on to the next object in the array, which would be, for example, the next sprite or shape behind the one you initially checked. While going through the list, you must notice when the parent changes, at which point you need to assume that all children of that common parent had their mouseEnabled property set to false, in which case the parent would become the next candidate. This is actually extremely complicated, because you're working backwards in a bottom-up approach with an incomplete set of objects that was generated from the top-down.
To get actual potential mouse event targets, consistent with the default dispatching logic... it is actually easier to start from the stage in a top-down manner and walk backwards through the display hierarchy in a depth-first search, checking mouseChildren to determine whether you need to step into children, and checking mouseEnabled if it's to be a target, otherwise stepping into the container's children and repeating the process from back to front again. This is much more accurate, complete, and staightforward. The only problem is you have to code it yourself.