Skip to content

(WIP) Proposal to simplify FocusTrap, revived - #99434

Closed
justinmc wants to merge 14 commits into
flutter:masterfrom
justinmc:focus-trap-simplification
Closed

justinmc wants to merge 14 commits into
flutter:masterfrom
justinmc:focus-trap-simplification

Conversation

@justinmc

@justinmc justinmc commented Mar 2, 2022 •

Copy link
Copy Markdown
Contributor

A few months back, I made an attempt at simplifying FocusTrap (#90240) in order to 1. match the native behavior that tapping outside textfields doesn't remove focus, except on web, and 2. allow buttons that don't remove the focus from text input fields. Here I'm reviving that attempt and seeing if it is feasible or not. Work in progress.

Behavior with this PR:

  • On web (mobile and desktop)
    • When a field has focus, tapping on some empty part of the screen causes the field to lose focus.
    • Doing so, then pressing tab, focuses the first item in the tab order, regardless of where the field was in the tab order.
  • On non-web platforms
    • Tapping on an empty part of the screen does not cause a focused field to lose focus.
  • Everywhere
    • Tapping a button doesn't cause a focused field to lose focus by default.

Related

Fixes #86972
Fixes #92541
Unblocks #76072 (virtual keyboards, as well as rich text editor bold buttons, etc.)
Original FocusTrap PR: #82575
Follow up that fixed clicks on prefix/suffix: #86041

@justinmc justinmc self-assigned this Mar 2, 2022
@flutter-dashboard flutter-dashboard Bot added a: text input Entering text in a text field or keyboard related problems f: focus Focus traversal, gaining or losing focus p: material_ui material_ui package in flutter/packages f: routes Navigator, Router, and related APIs. framework flutter/packages/flutter repository. See also f: labels. labels Mar 2, 2022
@skia-gold

Copy link
Copy Markdown

Gold has detected about 3 new digest(s) on patchset 14.
View them at https://flutter-gold.skia.org/cl/github/99434

@justinmc

justinmc commented May 4, 2022

Copy link
Copy Markdown
Contributor Author

@gspencergoog Here's my yet unsuccessful FocusTrap PR that I mentioned to you.

Basically what I tried to do here was remove the FocusTrapArea (in TextField) and the FocusTrap (routes.dart) and replace it with a GestureDetector and a simple Focus widget. It alllmost worked, but the gesture detector was stealing drag events from the event arena (such as drag to go back, etc.), causing a bunch of test failures. I think your approach with a custom gesture listener should work.

This issue #86972 has lots of discussion about this problem. Here are my reasons for needing this to allow buttons that don't unfocus a text input.

@justinmc

Copy link
Copy Markdown
Contributor Author

Closing in favor of #107262

@justinmc justinmc closed this Jul 19, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

a: text input Entering text in a text field or keyboard related problems f: focus Focus traversal, gaining or losing focus f: routes Navigator, Router, and related APIs. framework flutter/packages/flutter repository. See also f: labels. p: material_ui material_ui package in flutter/packages

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Proposal] Allow possibility to maintain focus on TextField Consider simplifying FocusTrap?

2 participants