I'm trying to catch when a user presses a "enter" key in a rich editable text field. It wasn't dispatching KeyboardEvent.KEY_DOWN so I found that it dispatches an "enter" key event. That seemed more appropriate but that is not getting dispatched either.
Here is my code:
editableRichTextField.addEventListener(FlexEvent.ENTER, commitTextEditorValues, false, 0, true);
Am I missing something?
NB: This is with Apache Flex 4.14.
I knocked up a sample application for this and it seemed that the RichEditableText does dispatch KeyboardEvent.KEY_DOWN. How are you catching it? The following code:
private function CCH():void
{
richEditableText.addEventListener(KeyboardEvent.KEY_DOWN, KeyDownHandler);
}
private function KeyDownHandler(event:KeyboardEvent):void
{
if (event.keyCode == Keyboard.ENTER)
{
Alert.show("Enter Key Pressed");
}
}
should trigger an alert (where the CCH method is the creation complete handler for the component/application.
You have to set multiline to false for the event to be dispatched. This is not helpful if you need to support multiple lines so you have to use #DaJobat's answer and listen on key down.
editableRichTextField.multiline = false;
Related
So to my understanding, there are keycodes to represent the keystrokes, for example:
public function left(e:KeyboardEvent):void
{
if (e.keycode == 65)
{
leftKey = true;
}
}
I want to do something similar with this logic and apply it for Mouse Events. I've searched on Google but haven't found much results for Flashdevelop AS3. Would there be a keycode to represent Mouse Events?
For example:
stage.addEventListener(MouseEvent.MOUSE_DOWN, down);
stage.addEventListener(MouseEvent.MOUSE_MOVE, move);
stage.addEventListener(MouseEvent.CLICK, click);
public function down(e:MouseEvent):void
{
if (e.keycode == ?)
}
public function move(e:MouseEvent):void
{
if (e.keycode == ?)
}
public function click(e:MouseEvent):void
{
if (e.keycode == ?)
}
Thanks in advance!
When you fire a mouse event that has a listener attached to it, then the function associated with that listener will get called. Period. You don't need to then, again, check to see if the mouse event happened. That's the whole beauty of event listeners. Just to make sure you get it, I'll post an example.
stage.addEventListener(MouseEvent.CLICK,mClick);
Great. We added a listener to the stage. Now, any time you click anywhere on the stage, this listener will cause that mClick function to get called. Now we write the mClick function.
private function mClick(me:MouseEvent):void{
trace("me.target.x",me.target.x);
trace("me.target.y",me.target.y);
}
me is just a variable we chose to represent the event that triggered this function. Event is a class. A MouseEvent is a subclass of Event. So we are saying that me is an Event of sublcass MouseEvent and that this is the expected input for this function. If you were to try to call this function elsewhere in your code it would throw an error saying that this function expected some sort of input.
me.target is the thing that caused the event to get triggered. In this case it is the mouse, so me.target.x will be the x position of the mouse at the time that the mouse was clicked.
That is all there is to it. You have just confused yourself a little bit by trying to apply a specific solution to a different problem, namely, how to register key presses on a keyboard. They are handled slightly fundamentally differently. With a keyboard, we check listen for if the keyboard had a key pressed and then in the event handler, we determine which key was pressed. With mouse events we would have a different listener for mouse move, mouse click, left mouse click and middle mouse click. Since each of those specific events has their own listener, we don't have to evaluate which button was pressed in the handler:
public function left(e:KeyboardEvent):void
{
if (e.keycode == 65)
{
leftKey = true;
}
}
The e is the thing that caused the event. In this case, the Keyboard key. Each key has a keycode. But instead of writing a different listener for every single key on the keyboard, we can just write one listener and one function and then evaluate which key was pressed inside the function. As stated before, with the mouse, the left mouse button gets its own event listener, so no need (or ability) to check that in the event listener. There are properties like ROLL_OVER and MOUSE_UP and MOUSE_DOWN. Look at the documentation for a full list.
I want to listen to stage for keyboard event, and I want to catch an event directly when it appears (not in bubbling or target). Why can't I do this?
Actually it seems that I can't use useCapture for keyboard events at all.
I want to open my inner console window by pressing tilda button, and change focus to input field. So, I wrote something like this
public function init(stage:Stage):void
{
stage.addEventListener(KeyboardEvent.KEY_DOWN, onStageKeyDown);
}
private function onStageKeyDown(event:KeyboardEvent):void
{
event.stopImmediatePropagation();
switch(event.keyCode)
{
case Keyboard.BACKQUOTE:
visible = !visible;
stage.focus = visible ? inputField : stage;
break;
}
}
The problem is, it writes "`" character in my input, which I don't want it to do. So, I decided to try to listen to keyboard event in capture phase to stop its propagation. But it seems that stage can't have capture phase, because there is no nodes before it. How can I handle that situation properly?
To simply answer your question, you can listen for keyboard events on the capture phase.
Most likely, the reason you can't, is because nothing has focus. If nothing has focus in your application then the stage will not get a keyboard event. By default, when a swf runs nothing has focus.
Give an item focus when your application starts (anything besides the stage itself), and the event will come.
public function init(stage:Stage):void
{
stage.focus = this; //assuming this is the document class
stage.addEventListener(KeyboardEvent.KEY_DOWN, onStageKeyDown, true);
}
Now, to follow up with what you are actually trying to accomplish (aside from your actual question) all you need to do is listen for the right event (TEXT_INPUT). Your answer is close, but it can be much simpler without the need for flags or a key down listener:
stage.focus = this; //give something focus, probably not needed if you have to click the text input in order to input text
//listen on the capture phase for text input
stage.addEventListener(TextEvent.TEXT_INPUT, onStageTextInput, true);
function onStageTextInput(event:TextEvent):void
{
switch(event.text)
{
//if the new text was a backquote or # sign, don't let the event trigger it's normal action
case "`":
case "#":
event.preventDefault(); //prevent default is needed
break;
}
}
I finally found a workaround for this problem.
First of all: handling and stopping KeyboardEvent.KEY_DOWN is NOT preventing TextField from getting input. That's sad because in this case it would be useful, but it seems there is some other reasons for not doing this.
So, what I should do is listen for TextEvent.TEXT_INPUT by inputField
inputField.addEventListener(TextEvent.TEXT_INPUT, onTextInput);
and listen to KeyboardEvent.KEY_DOWN by stage
stage.addEventListener(KeyboardEvent.KEY_DOWN, onStageKeyDown);
in case I may still want to put tilda of backquote signs in my TextField (for example by coping and pasting them) I decided to use a flag
private function onStageKeyDown(event:KeyboardEvent):void
{
switch(event.keyCode)
{
case Keyboard.BACKQUOTE:
...
inAction = true;
break;
}
}
so when TextEvent.TEXT_INPUTevent fires I can see if that was opening window action or not. And if it is, then preventDefault() behaviour, which means NOT inputting received sign in TextField
private function onTextInput(event:TextEvent):void
{
if(inAction)
{
event.preventDefault();
inAction = false;
}
}
I have a webpage with a flash header. In the flash header (block), different dropdownmenus are present together with a 'submit' button.
When the user presses 'enter', i want to submit the form.
However, I can't seem to be able to catch any key :
stage.addEventListener(KeyboardEvent.KEY_DOWN, onKeyDownFunc);
root.addEventListener(KeyboardEvent.KEY_DOWN, onKeyDownFunc);
optiesPanelNew.addEventListener(KeyboardEvent.KEY_DOWN, onKeyDownFunc);
optiesPanelNew.ddOptiesMerk.addEventListener(KeyboardEvent.KEY_DOWN, onKeyDownFunc);
function onKeyDownFunc(evt)
{
if (evt.keyCode == Keyboard.ENTER)
{
submitForm();
}
}
This javascript works if the html part of the page (non flash) has focus :
document.body.onkeydown = function theFunction()
{
alert("keydown");
}
Edit: Oh no, the flash file was written in AS2 ... sorry :-/
FYI : the code I ended up using was : (AS2) :
var keyListener:Object = new Object();
keyListener.onKeyDown = function():Void
{
if(Key.getCode()==13)
submitForm();
}
Key.addListener(keyListener);
I think you need to specify the event's type in the handler (i.e. KeyboardEvent) because this way the dispatched object will be cast to a Event object when its instance is passed to the handler. The Event class doesn't have the keyCode property, and subsequently the condition to submit the form is not met. That's why the form doesn't get submitted.
So, try replacing the
function onKeyDownFunc(evt)
line, with
function onKeyDownFunc(evt:KeyboardEvent)
and it should do the trick.
Have a great day.
I have a flash component TextInput within a movieclip, added to stage, through as3.
The moment this mc is added to stage, it assigns keyboard event (key down and key up events), to the main stage (main app stage), and set main stage focus to main stage.
So far so good.
The problem is, when I type ENTER, I catch KEY_DOWN, but when I release key ENTER, my KEY_UP event is uncatched by my function assigned to that event.
Any body knows why?
It only works if I click the flash player.
(Code provided in comment)
private function initAdded(e:Event){
_main.stage.addEventListener(KeyboardEvent.KEY_DOWN,checkKeysDown);
_main.stage.addEventListener(KeyboardEvent.KEY_UP,checkKeysUp);
MovieClip(_main).setStageFocus()
}
private function checkKeysDown(e:KeyboardEvent):void {
if (e.keyCode == 13) {
trace('enter down')
}
}
private function checkKeysUp(e:KeyboardEvent):void {
if(e.keyCode == 13){
trace('enter up')
}
}
I'm going to guess that the KEY_UP event is being handled by the text area you are typing in, and it doesn't want to share, so it kills the event. Try:
_main.stage.addEventListener(KeyboardEvent.KEY_UP,checkKeysUp, true);
This causes your event listener to catch the event in the capture phase, before the other event listener cancels propagation of the event.
I have an input TextField and have a KeyboardEvent.KEY_DOWN even listener on the stage to listen for the Keyboard.ENTER event. The event listener adds the entered text to an array or whatever, and then clears the TextField. The problem is that when the Enter key event fires and the TextField value is set to "", it leaves a carriage return in the TextField and the cursor positioned on the second line. WTF? I've been coding AS2 and AS3 for a LONG time and have never ran into this before. Am I losing my mind? Please help, people! :-)
Example:
var myTextArray:Array = new Array();
stage.addEventListener(KeyboardEvent.KEY_DOWN, onKeyDown);
function onKeyDown(e:KeyboardEvent):void{
if(e.keyCode == Keyboard.ENTER){
if(_inputText.text != null){
myTextArray.push(_inputText.text);
}
_inputText.text = "";
}
}
Simply replace KEY_DOWN with KEY_UP. It fixes the problem (for me at least)
Use KEY_DOWN -> Your code -> KEY_UP -> empty Field
An example (nasty code):
Message.addEventListener(KeyboardEvent.KEY_DOWN, function(e:KeyboardEvent):void
{
if(e.keyCode == Keyboard.ENTER)
{
// Your code...
}
});
Message.addEventListener(KeyboardEvent.KEY_UP, function(e:KeyboardEvent):void
{
if(e.keyCode == Keyboard.ENTER)
{
Message.text = "";
}
});
If you are able to enter a carriage return, it means the TextField is multiline, isn't?
Have you tried to empty your input text in a KeyboardEvent.KEY_UP event listener callback function?
Are you hitting enter with text field in focus? In that case, it might be that onKeyDown is called before the text field's value is updated by the keyboard action. You set the textfield to empty string in the onKeyDown, and then flash adds a new line to it.
Add a text input event listener to the text field and add trace statements to both event handlers to know the order of events.
If you are in Flash authoring mode (in the IDE), you need to uncheck Control -> Disable Keyboard Shortcuts while testing. Also try making a "cleanup" handler for KEY_UP.
inputfield.addEventListener(Event.CHANGE, onChange);
private function onChange(e:Event):void {
if ( inputfield.text.charCodeAt(inputfield.text.length - 1) == 13 ) {
inputfield.text = inputfield.text.substr(0, inputfield.text.length - 1);
}
}
I know it is a very old question, still thought of sharing my solution. I disabled multiline feature of textbox in fla file. After that I don't get any carriage return in textbox.
This does seem to be some kind of bug - I get it too. If you just set textField.text = "" in your constructor (or where-ever) it seems to resolve the problem.