WPF Custom Tab Order

By default, the tab order of controls on a WPF screen is based on the order in which they appear in the XAML.  This is suitable for a typical form, but when working in a composite application, a little more effort is required.

When a screen is composed of more than one custom control (typically a view), the default tabbing will not behave itself so well.  In order to enable tabbing into and across views on a screen, each view must use the attached property:

                 KeyboardNavigation.TabNavigation="Continue"

This facilitates tabbing based on the layout of the XAML into and across views.  If however you require more control over tab order say, within a view or in fact any Content Control, you can use the TabIndex property on each of the contained controls.  However, the controls that have specified a TabIndex lose their tab stop, unless the above line (on the view or content control) is changed to:

                 KeyboardNavigation.TabNavigation="Local"

An oddity with this approach, occurs if you add the above property to an expander, and add tab indexes to the contained controls.  The tabbing steps straight to the contained controls, missing the expander toggle button, which now is tabbed to after all the contained controls have been visited.  Resolve this by moving the above KeyboardNavigation.TabNavigation property to a contained grid instead.

Finally, in order to prevent tabbing from moving on to the next screen, add the following property to the outer containing view for the screen:

                 KeyboardNavigation.TabNavigation="Cycle"

This keeps the focus on the current screen and cycles the tabbing back to the top of the screen.

November 25 2009
blog comments powered by Disqus