TreeView with Accessibility Features

This sample demonstrates the accessibility enhancements available in the TreeView component.

Standard TreeView (without accessibility features)

This is the default TreeView behavior, which matches the original Web Forms control.

TreeView with Accessibility Features Enabled

Set UseAccessibilityFeatures="true" to enable:

ARIA attributes for screen readers (role="tree", aria-expanded, aria-level, etc.)
Keyboard navigation:
- Arrow Right - Expand a collapsed node
- Arrow Left - Collapse an expanded node
- Enter or Space - Activate node link or toggle expansion
- Tab - Move focus between nodes
Focus management with tabindex for keyboard users

Accessibility Benefits

The UseAccessibilityFeatures parameter provides benefits for:

🎹 Keyboard Users

Navigate and interact with the TreeView entirely using keyboard shortcuts, without requiring a mouse.

🔊 Screen Reader Users

Get proper semantic information about tree structure, node states (expanded/collapsed), and depth levels through ARIA attributes.

🎤 Speech Recognition Users

Benefit from larger interactive areas and keyboard equivalents, making voice commands more reliable.

👆 Touch Device Users

Use keyboard equivalents as an alternative to small touch targets for expand/collapse actions.

Code Example


<TreeView UseAccessibilityFeatures="true">

  <Nodes>

    <TreeNode Text="Home" Expanded="true">

      <TreeNode Text="Products">...</TreeNode>

      <TreeNode Text="About">...</TreeNode>

    </TreeNode>

  </Nodes>

</TreeView>