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:

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.