Ian Serlin

Disabling keyboard shortcuts in Flex 4 Lists

Posted by Ian Serlin | Tweet This | Filed under Actionscript 3, Adobe Flex, problem solution

Problem

Flex 4 Lists pack a lot of awesome, especially compared to Flex 3 Lists. One of the new (AFAIK) built-in features are keyboard shortcuts for navigating through items in the list including enabling the ability to easily live search through items in the list’s dataProvider. For the Event Planner of vokle.com I needed to show in-place forms for editing the events represented by the list including updating titles, descriptions, etc. In this instance the Flex 4 keyboard listeners were wreaking havoc on the user’s ability to simply type in the form.

Solution

At the time of this writing there is not a built-in option to disable the keyboard navigation in Flex 4 Lists, so here is a custom class that gives you that ability.

KeyShortcutsToggleList.as

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

package {
 
	import flash.events.KeyboardEvent;
 
	import spark.components.List;
 
	public class KeyShortcutsToggleList extends List {
 
		public var allowKeyboardNavigation:Boolean = false;
 
		override protected function keyDownHandler(event:KeyboardEvent) : void {
			if( allowKeyboardNavigation ){
				super.keyDownHandler( event );
			}
		}
 
		override protected function keyUpHandler(event:KeyboardEvent) : void {
			if( allowKeyboardNavigation ){
				super.keyUpHandler( event );
			}
		}
	}
}

If you come up with any other cool Flex 4 List hacks or a better way to solve this problem write a post and link to it in the comments!

Tagged : flex4, keyboard, lists

Comments (0)