Skip to content

Focus-based navigation #1608

Description

@Hixie

We should implement next/prev (tab) and direction (d-pad) navigation of focusable controls, and ensure that everything is keyboard-accessible.

From http://developer.android.com/guide/topics/ui/accessibility/checklist.html:

Make sure users can navigate your screen layouts using hardware-based or software directional controls (D-pads, trackballs, keyboards and navigation gestures). In a few cases, you may need to make user interface components focusable or change the focus order to be more logical for user actions.

Activity

  1. added
    c: new featureNothing broken; request for a new capability
    frameworkflutter/packages/flutter repository. See also f: labels.
    on Feb 4, 2016
  2. added this to the milestone on Feb 4, 2016
  3. Hixie commented on Feb 4, 2016

    @Hixie
    ContributorAuthor
  4. added
    a: accessibilityAccessibility, e.g. VoiceOver or TalkBack. (aka a11y)
    on Jan 26, 2017
  5. modified the milestones: , on Jan 26, 2017
  6. jonahwilliams commented on Aug 23, 2018

    @jonahwilliams
    Contributor

    Is focus order the same as the traversal order? If so, we can simply reuse the semantics tree to handle focus traversal, with an additional focus state. Although I am concerned we would end up with two different concepts of focus.

    cc @jslavitz

  7. Hixie commented on Aug 24, 2018

    @Hixie
    ContributorAuthor

    We can't use the semantics tree, it's not created if semantics are disabled.

  8. jonahwilliams commented on Aug 24, 2018

    @jonahwilliams
    Contributor

    Turning on semantics when we detect tab navigation seems reasonable to me. The information needed to do focus based navigation is the same.

  9. 12 remaining items

  10. gspencergoog commented on Oct 9, 2019

    @gspencergoog
    Contributor

    #40186 had to be reverted :-( . Will close this again as soon as #42278 lands.

  11. gspencergoog commented on Oct 15, 2019

    @gspencergoog
    Contributor

    This has re-landed in #42278

  12. andredealmei commented on Dec 7, 2019

    @andredealmei

    on web , tab not focus next textfield

  13. dudeofawesome commented on Feb 18, 2020

    @dudeofawesome

    Tab focus also seems to not work on macOS builds on v1.15.4-pre.83

  14. SimonAmpleman commented on Feb 28, 2020

    @SimonAmpleman

    Android with external keyboard : When I press tab on the keyboard, it sometime jumps to the next field, sometime add a tab spacing in the field, and sometime add a tab spacing in the field and jump to the next field.

  15. gspencergoog commented on Feb 28, 2020

    @gspencergoog
    Contributor

    @SimonAmpleman, yes, this is a known issue that will be addressed. See #33521 for progress. Unfortunately, to fix this problem, it's a pretty big change. What's happening is because of two problems: there's no synchronous key handling, so we can't stop propagation of key events when an action handles them (and so the text field eventually gets them too), and there's not one source of truth for the state of a text edit, so editing updates are racy. These will both be addressed. I can't give an exact timeline, but they are a priority.

  16. SimonAmpleman commented on Feb 28, 2020

    @SimonAmpleman
  17. Timmmm commented on Mar 8, 2021

    @Timmmm

    Am I right in thinking that this adds best-guess automatic tab ordering? There doesn't seem to be any way to specify the tab order manually. I guess that's decent for simple apps but it can give pretty weird results:

    flutter_tabs.mp4

    We need a way to specify the tab order manually. Is there an issue for this already or should I open one?

  18. gspencergoog commented on Mar 8, 2021

    @gspencergoog
    Contributor

    @Timmmm No, we already have that. Check out FocusTraversalGroup and OrderedTraversalPolicy.

  19. Timmmm commented on Mar 10, 2021

    @Timmmm

    FocusTraversalGroup worked perfectly and is very elegant and easy to use (like most things in Flutter). Nice one!

  20. github-actions commented on Aug 4, 2021

    @github-actions

    This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.

  21. locked as resolved and limited conversation to collaborators on Aug 4, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

a: accessibilityAccessibility, e.g. VoiceOver or TalkBack. (aka a11y)a: desktopRunning on desktopc: new featureNothing broken; request for a new capabilityframeworkflutter/packages/flutter repository. See also f: labels.p: material_uimaterial_ui package in flutter/packages

Type

No type

Projects

No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions