Capturing arrow keys (up, down, left, right)

[Dave T]

Hi,

I'm trying to create a "rich list" widget, which basically should
contain the functionality of a ListBox, but each entry can be
arbitrary HTML rather than simply a line of text. It's working fine,
except that I cannot capture arrow key presses. I've sunk ONKEYUP,
ONKEYDOWN and ONKEYPRESS events for the widget, and the
onBrowserEvent(e) method gets invoked during pretty much any key-press
*except* when I'm pressing one of the arrow keys.

Presumably, the browser may be intercepting arrow-key events to handle
on its own. Is this just a limitation that I can't get around? BTW, my
widget extends VerticalPanel. I tried with it inside a ScrollPanel,
and then not inside a ScrollPanel (neither configuration worked they
way I wanted it to.)

Thanks.

[Reinier Zwitserloot]

You should be able to catch them. You may want to print the character
captured just in case you don't have the right keycodes. Note that IE
only sends alphanumerics to keypress, stuff like arrow keys only goes
to keyup and keydown.

[mP]

Every key even non printable ones (like shift,control, cursor left
etc) has a unique keycode. Keycodes arent ascii codes. As suggested by
RZ it should be easy to write a KeyListener to show each code.

[mP]

public final static int BACKSPACE = KeyboardListener.KEY_BACKSPACE;

public final static int CURSOR_LEFT = 37;
public final static int CURSOR_UP = 38;
public final static int CURSOR_RIGHT = 39;
public final static int CURSOR_DOWN = 40;

public final static int DELETE = KeyboardListener.KEY_DELETE;

public final static int END = KeyboardListener.KEY_END;

public final static int ENTER = KeyboardListener.KEY_ENTER;
public final static int ESCAPE = KeyboardListener.KEY_ESCAPE;

public final static int HOME = KeyboardListener.KEY_HOME;

public final static int INSERT = 45;

public final static int PAGE_DOWN = KeyboardListener.KEY_PAGEDOWN;
public final static int PAGE_UP = KeyboardListener.KEY_PAGEUP;

public final static int TAB = KeyboardListener.KEY_TAB;

public final static int FUNCTION_F1 = 112;
public final static int FUNCTION_F12 = 123;

[Dave T]

Hey all,

Thanks for the responses so far. In fact, I'd done just what you've
all recommended; I guess I wasn't too clear on the fact that pretty
much every other key press event was captured except for the arrow
keys. The latest thing I've tried is using a hidden ListBox to grab
focus and process key events, since I figured that ListBoxes need to
process arrow-key events. I just did s simple test like this:

hiddenWidget.addKeyboardListener(new KeyboardListener() {
public void onKeyDown(Widget sender, char keyCode, int modifiers) {
GWT.log("SPRichList, hidden widget, on key down", null);
}

public void onKeyPress(Widget sender, char keyCode, int modifiers)
{
GWT.log("SPRichList, hidden widget, on key press", null);
}

public void onKeyUp(Widget sender, char keyCode, int modifiers) {
GWT.log("SPRichList, hidden widget, on key up", null);
}
});

onKeyPress events don't get logged for arrow keys, but onKeyDown and
onKeyUp events do. For other keys (e.g. any key w/ an ASCII character)
all three are logged.

I'd originally sunk events for the VerticalPanel and tried this:

public void onBrowserEvent(Event event) {
int evtType = DOM.eventGetType(event);
if (evtType == Event.ONKEYPRESS) {
int keyCode = DOM.eventGetKeyCode(event);
GWT.log("RichList item, key press code = " + keyCode, null);
} else if (evtType == Event.ONKEYUP) {
int keyCode = DOM.eventGetKeyCode(event);
GWT.log("RichList item, key up code = " + keyCode, null);
}
}

No log message were written when I'd press the arrow keys. But press,
say, the 'm' key and it would log.

[Axel Kittenberger]

Your original version misses OnKeyDown events.

I *can* capture arrow keys in my project.

things to check:
* are you calling DOM.sinkEvents for events you want to get?
* are you having the browsers Focus? Do you handle Focus correctly? I
might suggest extending FocusPanel for example...

Not that capturing special keys doesn't come with unique problems,
where one has to differ between keydown and keypress (repeat) events,
especially firefox on linux, where the browser will not send keydown
events when a second key is pressed while another is beeing held
(Grrr... Firefox....)

You can see working code here,

http://axed.googlecode.com/svn/trunk/src/org/axed/user/client/AxedWidget.java

however I recently changed the keyboard capturing to a hidden
editbox... but the version yet in SVN is classic capturing of DOM
events.

[Dave T]

Interesting; thanks for the info. Last night, I'd gotten my hidden-
ListBox approach to work, but of course I'd rather do it "correctly",
so I'll diff what you have and what I had, and see what I missed.
There's definitely *some* difference in how the arrow-key events are
captured (at least in IE and Firefox on Windows), but it sounds like I
probably missed something as well.

Anyway, thanks for all the input. I'll post anything interesting if I
find it.

On Jan 8, 6:00 am, Axel Kittenberger <axe...@gmail.com> wrote:
> Your original version misses OnKeyDown events.
>
> I *can* capture arrow keys in my project.
>
> things to check:
> * are you calling DOM.sinkEvents for events you want to get?
> * are you having the browsers Focus? Do you handle Focus correctly? I
> might suggest extending FocusPanel for example...
>
> Not that capturing special keys doesn't come with unique problems,
> where one has to differ between keydown and keypress (repeat) events,
> especially firefox on linux, where the browser will not send keydown
> events when a second key is pressed while another is beeing held
> (Grrr... Firefox....)
>
> You can see working code here,
>

> http://axed.googlecode.com/svn/trunk/src/org/axed/user/client/AxedWid...