Add arrow key navigation support to VirtualizedList items #815
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Enable keyboard users to navigate between list items using ArrowUp/ArrowDown keys instead of having to Tab through all 50 items.
Contributor
|
Before and After Screenshare video would be great. |
Contributor
|
/azp run |
|
Azure Pipelines successfully started running 1 pipeline(s). |
Contributor
Author
I cannot show them that I am pressing arrow. |
vineethkuttan
approved these changes
Jan 13, 2026
Contributor
|
/azp run |
|
Azure Pipelines successfully started running 1 pipeline(s). |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
This PR adds arrow key navigation support to VirtualizedList items for keyboard-only users.
Why
In the VirtualizedList component, items could not be navigated using arrow keys. Users were required to press Tab repeatedly to move through all 50 list items before reaching the next section. This creates an excessively long and inefficient navigation path.
Keyboard-only users had to press Tab up to 50 times to get through the list, which is time-consuming, frustrating, and significantly slows task completion. This creates accessibility barriers for users with motor impairments, cognitive challenges, or those who rely heavily on keyboard navigation.
What
createKeyDownHandler) that handles ArrowUp/ArrowDown to move focus between list itemsTouchableHighlighttoPressablefor better keyboard event support on WindowsonKeyDownandkeyboardEventsprops to list items using React Native Windows patternonFocushandlers to track which item is currently focusedScreenshots
N/A - Keyboard navigation fix, no visual changes
Testing
Microsoft Reviewers: Open in CodeFlow