I'm creating a game in Flash CS5.5, basically a version of "Who wants to be a millionaire?".
I have an answerDisplay Class which contains an answer text. Answer texts can become rather long, and since I have limited screen space I check for very long texts and if a text is too big I add a UIScrollbar besides the text field.
Which works nicely, except for one thing - when the user drags the scroll tab, the text scrolls fine. When the user clicks one of the scrollbar arrows the text field also scrolls fine, as long as the button is clicked, but as soon as the mouse button is released the click event of the containing answerDisplay class is fired, which leads to my program wrongly thinking the user had selected the answer while he just tried to scroll.
I tried catching this via e.target and/or e.currenttarget, but it's no use, I never get a reference to the scrollbar, so I'm never sure if the user clicked one of the arrows or if he genuinely clicked the answer to select it.
How can I make certain that the click event of my answerDisplay Class is not fired when the UIScrollbar is used?
Checking e.target and e.currentTarget is a good start.
You might also want to check the event phase:
For more details on event phase, check grapefrukt's answer
A click from the answerDisplay Class dispatched event should have AT_TARGET phase, while the UIScrollbar event should have the BUBBLING_PHASE. This should help you differentiate between the two.
Also, you could add event listener to the UIScrollbar in your answerDisplay Class to capture the event and then suppress it via stopPropagation().
Depending on how UIScrollbar uses event bubbles internally, you can try either stopPropagation(), either stopImmediatePropagation(). The goal is to stop the event bubbling up from answerDisplay, but not breaking the UIScrollbar functionality.
Related
Update: Apparently this is part of the accessibility scheme of Flex Spark Components
Button control Press the Spacebar to activate the Button control. To cancel activating a button, press the Tab key to move the focus off
the Button control before releasing the Spacebar.
I guess it can be turned off through compiler directives: Accessibility best practices
Question: Is there any reason a Spark Button would trap key events, in particular a "spacebar" key event?
Background: I've inherited and am maintaining a large legacy project done in Flex 4.6. I am seeing a weird behavior with a Spark Button. Essentially, once the button has been clicked on (i.e. given focus) a keyEvent (spaceBar) will trigger the click event handler attached to the button.
Weird, right?
The button is defined in MXML (below) within an MX:Module. The module has key event listeners attached to the stage but the event handlers for those do nothing with the button:
this.stage.addEventListener(KeyboardEvent.KEY_DOWN, echoKeyDownHandler);
this.stage.addEventListener(KeyboardEvent.KEY_UP, echoKeyUpHandler);
If I put a trace statement in the button's event handler to check the event type when this weird behavior occurs, the type is reported as a click. I don't see anything in the docs for the Spark Button about capturing key events like this.
<s:Button id="toggleBtn"
label="Editor"
click="toggleBtn_clickHandler(event)"
x="943" y="8"/>
This is quite normal with Flex. You should also be able to navigate through the interactive elements by using the <tab> key. <space> usually acts like a click. You could try to avoid this by either
a) set the focus to another object after pressing the button
or
b) by checking the keyboardPressed property.
Both is a bit hacky imho. I am not sure if it is possible to turn of keyboard navigation completely in Flex.
[edit 1] I am just thinking if it wouldn't help to simply overwrite the default keyboard handler like this:
override protected function keyDownHandler(evt:KeyboardEvent):void {}
this is inherited by UIComponent. and you would need to create an own component extending s:Button. A little drawback...
[edit 2] I wasn't able to stop thinking about that, even I stopped using Flex 2-3 years ago. So I googled a bit and found this stack overflow post:
How to disable default browser navigation with Space in Flex
My movie has 3 frames, first one is the welcome screen with the play button, and after I press it and jumped to frame2 I have to click the movie for my character/player to respond and move by arrows. Same happens if I go back to frame2 from my game-over screen placed on frame3.
I use gotoAndPlay(); to navigate frames, naturally.
if it's something having to do with my code from frame2 i will post what it is required. I'd like to know why is that happening and how to fix it. THANKS!
Clicking your character gives it focus.
Only* what has focus receives keyboard events.
If you register the listener for the keyboard event on your character object, you have to click it first, before it receives those events.
However, the KeyboardEvents bubble up the display list and eventually reach the top most container which is the stage. This gives you two options:
Handle the focus yourself by assigning the object that should have focus to the stage.focus property. This is basically doing what the clicking does in your current situation.http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/display/Stage.html#focus
register your listeners at the stage
The user simply needs to click anywhere on the flash stage to add keyboard focus. Normally, a good way of achieving this is by using a start button, or something similar, for that first bit of mouse/keyboard focus.
I'm looking at this:
http://www.netmagazine.com/tutorials/create-page-flip-effect-html5-canvas
However, I have one problem with that - I need to be able to click on the pages, even the edges, without triggering the page turn. I want the pages to turn when a button outside of the canvas is pressed. Is this possible using the base they provided, or do I need to go an entirely different direction?
Yes that can be done.
From what i can see, you need a click event that doesnt trigger the page drag. You need to assign a flag for this.
Let Drag = mouse drag/mouse move, down = mouse down, release = mouse release events respectively.
Initialize your flag variable as false. When a drag event is encountered it becomes true. Otherwise it remains false. As long as it is false when the mouse release event occurs it can be treated as a click. Thats the basic principle behind using mousedown and mouseup as a click event.
You will have to use e.srcElement or e.target to give you the element your cursor is currently positioned over inorder to trigger click functions relative to that element.
If you want a more detailed explanation on the page flip technique then check this out. Helped me lot.
I have a SimpleButton on the stage, and in the click event for it, I remove it using removeChild(). When re-adding the button, it gets re-added in it's "over" state, not the "up" state as expected.
I'm pretty sure it's a bug, so I've filed a JIRA: http://bugs.adobe.com/jira/browse/SDK-31445, my question is now on how to fix it, if anybody's had a similar experience.
What I've tried:
using visible = false instead works, but I'd prefer to remove it off the stage altogether as the game I'm working on can have a lot of popups/screens.
Firing the mouse_out event manually - doesn't work, and in any case, the mouse_out event fires as expected (perhaps before resetting to the up state, it makes a check to see if it's added to the stage, finds out it's not, then quits early)
Resetting the stage focus - I thought it was a problem with the stage focus, as you were losing focus when the button was hidden, but resetting it didn't fix it.
I could temporarily swap the over and up state when it's hidden, but that seems like an ugly fix.
I've been Having this problem as well, removing one button and adding another in response to an Mouse up event on a separate sprite.. IE the mouse isn't over either of the buttons at the time, But when the first button (the one with the problem) was previously removed the mouse was indeed over it so it hadn't received a mouseOut event and retained itself in the over state. Using visibility to work round this which is ok for my needs BUT the alternative answer would be to replace with a new instance of the button before adding it to the Display List.
I Have a JButton (or any Component, really) that I would like to trick into thinking that it has been clicked on and therefore firing its action performed event. I don't want to call the action performed or doClick directly because I am trying to make a solution that generalizes beyond buttons, and I am constrained to posting events.
I would have thought that posting a MousePressed event to the system event queue would have done it, but no. ( with appropriate location, click count etc.)
Then I thought a mouse entered followed by a mouse move, a mouse pressed, a mouse released, and a mouse clicked, but no.
None of this causes the JButton to fire its action performed like it does when I actually click on it.
Has anyone caused a JButton to spit out its action performed event by driving it with mouse events? Moved a JSlider with mouse events? Expanded a tree node?
Thanks for any help.
Have you tried the fireActionPerformed method? I can't off the top of my head now remember if all components have it but if i remember right, all buttons and menu items should deifnately have it. Just a thought