Add ability to navigate by arrows in "Find Resources" window

[piotrzarzycki21]

Find Resources window should have ability to navigate trough files using arrows on keyboard

[piotrzarzycki21]

@joshtynjala I would like to implement here navigation where user can use keyboard arrows to go trough filtered items on the list. My attempt was to register on KeyboardEvent.KEY_DOWN and handle that. I have registered on KEY_DOWN on result view list - 12c8ca3 - and it worked.

My next step was to register on Find Resources window KeyboardEvent.KEY_DOWN and listen for pressed arrows. I have tried several options of registration and whatever I do KeyboardEvent.KEY_DOWN handler has not been called at all. I have registered even KEY_DOWN on stage, but I don't get event when I'm pressing arrows either.

this.stage.addEventListener(KeyboardEvent.KEY_DOWN, findResourcesView_keyDownHandler);

Do you have any idea what it may be ?

[joshtynjala]

@piotrzarzycki21 If the ListView has focus, the arrow keys should already work for changing the selection. Is that not working for you?

[piotrzarzycki21]

@piotrzarzycki21 If the ListView has focus, the arrow keys should already work for changing the selection. Is that not working for you?

Nope.

However the thing is in general I wanted to navigate by arrows not when I have selection in ListView. Imagine that I just typed something in search text input and without using mouse I wanted to navigate trough my list - this is how it was working in the previous Flex popup. I can easly implement that, but I don't get KEY_DOWN event at all no matter what I do.

[joshtynjala]

Hmm... it looks like TextInput calls stopPropagation() when an arrow key is handled. I should probably change that to preventDefault() instead.

Right now, as a workaround, you could probably add a KeyboardEvent.KEY_DOWN listener at a higher priority on the TextInput (or you could use the capture phase).

this.searchFieldTextInput.addEventListener(KeyboardEvent.KEY_DOWN, searchFieldTextInput _keyDownHandler, false, 10);

And the listener might look something like this:

private function searchFieldTextInput_keyDownHandler(event:KeyboardEvent):Void {
		if (event.isDefaultPrevented()) {
			return;
		}
		if(event.keyCode == Keyboard.DOWN) {
			event.preventDefault();
			// do what you need to do here
		}
}

I haven't actually tried this code, but I think that it should work.

[piotrzarzycki21]

Thanks Josh - I will try tomorrow. Do you want me to raise issue somewhere ?

[joshtynjala]

Yeah, go ahead an create an issue here, so that I don't forget:

https://github.com/BowlerHatLLC/feathersui-openfl/issues

[piotrzarzycki21]

Thanks @joshtynjala for above code - it's working nicely. I have pushed my changes cause this is feature which I was using a lot in Flex version of that popup. Once you resolve issue 54 in your repository I will change code to do not use workaround.

[rat-moonshine]

Can we have this issue close now? I see the mentioned feathersui/feathersui-openfl#54 issue is closed now.

[piotrzarzycki21]

Can we have this issue close now? I see the mentioned BowlerHatLLC/feathersui-openfl#54 issue is closed now.

I need to verify if workaround which I have made can be removed. Plus issue is close - was FeathersUi released with that issue ?

[joshtynjala]

Feathers UI beta.3 has not yet been released. I'm waiting on new releases of Lime/OpenFL first because they need to be updated for compatibility with Haxe 4.2.

Regardless, I've determined that you should not remove the "workaround" after I release the update. After some thought, even with the original issue with stopPropagation() being fixed, this is still the correct solution because a higher priority is needed so that the default behavior of the TextInput is overridden.