Keyboard Friendly WPF Applications

Back in my Linux-only days I used the keyboard for everything, and I barely touched the mouse, but during the last five years, working full-time as a .NET developer on Windows systems, I started to use the mouse a lot more than I used to.
Recently, I have been trying to cut back on my mouse use and go back to keyboard-only. This made me notice that some of my WPF applications are not very keyboard friendly (keyboard shortcuts, weird tab order, etc...).

In my search for improving keyboard-support on my WPF applications I found a few tips that I would like to share:

1. AccessText
To add access keys to your buttons and menu item you can use the "_" character (in Windows.Forms this used to be the done using the "&" character).

Since not all of the WPF controls supports this (as far as I know, only menu items and buttons support this), you can use the AccessText object for this, for example:

<AccessText>Sort _by</AccessText>

The access keys are then underlined like this:
AccessText example

2. Labels
If you want to allow the user to jump quickly to a ComboBox, ListBox or any control that doesn't have a label (like a button or a menu item) you can add your own label:

<Label Target="{Binding ElementName=myCombo}">
  <AccessText>_My Combo:</AccessText>
</Label>
<ComboBox x:Name="myCombo" ... />

3. InputBinding
You can use the InputBindings property to bind keyboard shortcuts to existing command.

For example, I have a ListBox that has a context menu, that context menu has a menu item that is binded to the "RefreshCommand" property of the view model, and I want to make the F5 run this command. To do that I add an input binding like this:

<ListBox ...>
  <ListBox.InputBindings>
    <KeyBinding Key="F5" Command="{Binding RefreshCommand}" />
  </ListBox.InputBindings>

4. TabIndex
Sometimes when you're tabbing between controls it gets messed up, to fix it you can use the "TabIndex" property and set numeric values for each control. The control with a tab index of 0 will be the first to focus.

5. Focusable
Sometimes you have controls that the user shouldn't focus on (it sometimes happens when overriding control templates), to disable a control from being focused on, set the "Focusable" property to "False", this way when the user tabs between controls this control will be skipped.

Comments

Anonymous said…
Thanks for your post.
Can you please post the code for tabbing between controls? I have searched various site for this process but I couldn't get correct code.

Popular posts from this blog

Restart the Windows File Sharing Service to fix weird problems

WPF, ImageSource and Embedded Resources

SharpDevelop dark color scheme