Silverlight Tree View Accessibility

Silverlight TreeView is a very common user control for hierarchical data display. For example, it can be used to display organization hierarchy or any other entity hierarchy data. Within each treeview node, you may have more than one user controls, like a CheckBox + a TextBox. This presents a challenge to user accessibility:Tab  key will not tab through each control within a TreeView node if you use the default styles or item template. Tab key only stops once at each node.

To get Tab key tab through each control within each node, I used a hierarchy data template as follows:

<ctrl:HierarchicalDataTemplate ItemsSource="{Binding Children}">
    <ContentControl TabNavigation="Local">

        <Border Background="Transparent">

            <StackPanel>

                <Checkbox IsChecked="{Binding IsSelected}”/>

                <TextBox Text="{Binding PercentValue }”/>

            </StackPanel>

        </Border>
    </ContentControl>

</ctrl:HierarchicalDataTemplate>

The key here is to use a ContentControl in HierarchicalDataTemplate and set TabNavigation="Local". With this, I am able to tab through the checkbox and the textbox within each tree node.

Note: ctrl is referred to the following name space:

xmlns:ctrl="clr-namespace:System.Windows;assembly=System.Windows.Controls”