## Description
This PR adds `DropdownMenu.selectOnly`. This property allows users to
get the DropdownMenu behave as a 'select' component.
It is meant as a future replacement for
`DropdownMenu.requestFocusOnTap`.
## Motivation
On mobile, a dropdown menu widget is usually used as a ‘select’ widget
because opening the keyboard for searching/filtering is not convenient.
In Flutter, this is currently implemented through
`DropdownMenu.requestFocusOnTap` which defaults to false on mobile and
true on desktop.
The `DropdownMenu.requestFocusOnTap` property is currently used to set
`FocusNode.canRequestFocus`. This leads do difficulties mainly related
to focus traversal:
- Keyboard traversal requires workarounds (for instance relying on the
trailing icon to be focusable).
- Keyboard shortcuts require also a workaround (currently relying on a
Focus widget in a Stack).
- The `DropdownMenu` decoration does not reflect the focus state.
This PR proposes a new property named `DropdownMenu.selectOnly` which
does not require `DropdownMenu.requestFocusOnTap` to be false to make
the `DropdownMenu` behave like a select widget.
With this property the `DropdownMenu`:
- Supports keyboard navigation on mobile and desktop.
- Has a correct decoration when focused.
- Does not rely on the trailing icon to be focusable (see
https://github.com/flutter/flutter/issues/174096).
In the future this property could be used as a replacement for
`DropdownMenu.requestFocusOnTap`. For the moment, for compatibility, it
does not replace `DropdownMenu.requestFocusOnTap`.
## Related Issue
Fixes [Allow DropdownMenu to be non-editable and focusable (select
control) ](https://github.com/flutter/flutter/issues/178009)
Also related to [Make DropdownMenu's trailing icon not focusable by
default](https://github.com/flutter/flutter/issues/174096) and
[[Material3] DropdownMenu Keyboard
Accessibility](https://github.com/flutter/flutter/issues/123797).
## Tests
- Adds 9 tests.
This change fixes a crash in `EditableText` that occurs when the text
editing value changes between two scrolls, when the second scroll ends
`_dataWhenToolbarShowScheduled` will be invalidated. If the second
scroll ends before the post frame callback scheduled by the first scroll
has a chance to execute, there will be a crash because
`_dataWhenToolbarShowScheduled` is being accessed while null.
This change also invalidates a scheduled toolbar if the text editing
value has changed before the post-frame callback has a chance to run.
Fixes#179164
## Pre-launch Checklist
- [x] I read the [Contributor Guide] and followed the process outlined
there for submitting PRs.
- [x] I read the [Tree Hygiene] wiki page, which explains my
responsibilities.
- [x] I read and followed the [Flutter Style Guide], including [Features
we expect every widget to implement].
- [x] I signed the [CLA].
- [x] I listed at least one issue that this PR fixes in the description
above.
- [x] I updated/added relevant documentation (doc comments with `///`).
- [x] I added new tests to check the change I am making, or this PR is
[test-exempt].
- [x] I followed the [breaking change policy] and added [Data Driven
Fixes] where supported.
- [x] All existing and new tests are passing.
---------
Co-authored-by: Renzo Olivares <roliv@google.com>
<!-- start_original_pr_link -->
Reverts: flutter/flutter#178817
<!-- end_original_pr_link -->
<!-- start_initiating_author -->
Initiated by: Piinks
<!-- end_initiating_author -->
<!-- start_revert_reason -->
Reason for reverting: change was landed during tree closure
<!-- end_revert_reason -->
<!-- start_original_pr_author -->
Original PR Author: flutter-zl
<!-- end_original_pr_author -->
<!-- start_reviewers -->
Reviewed By: {chunhtai}
<!-- end_reviewers -->
<!-- start_revert_body -->
This change reverts the following previous change:
This is a reland of #177570, which was reverted in #178744 due to test
failures.
The original PR introduced `hitTestBehavior` to the semantics framework
but incorrectly applied `opaque` behavior to `ModalRoute`, which blocked
platform views from receiving pointer events.
Instead of making the entire modal opaque, we:
1. Keep `ModalRoute` without explicit `hitTestBehavior` (defaults to
`defer`)
2. Make only the dialog/sheet content opaque (blocks clicks to barrier)
3. Platform views remain clickable because they're outside the opaque
content boundary
Fixes#149001
Original PR: #177570
Revert: #178744
<!-- end_revert_body -->
Co-authored-by: auto-submit[bot] <flutter-engprod-team@google.com>
This is a reland of #177570, which was reverted in #178744 due to test
failures.
The original PR introduced `hitTestBehavior` to the semantics framework
but incorrectly applied `opaque` behavior to `ModalRoute`, which blocked
platform views from receiving pointer events.
Instead of making the entire modal opaque, we:
1. Keep `ModalRoute` without explicit `hitTestBehavior` (defaults to
`defer`)
2. Make only the dialog/sheet content opaque (blocks clicks to barrier)
3. Platform views remain clickable because they're outside the opaque
content boundary
Fixes#149001
Original PR: #177570
Revert: #178744
This is my attempt to handle
https://github.com/flutter/flutter/issues/6537 for the SearchAnchor
widget.
---------
Co-authored-by: Victor Sanni <victorsanniay@gmail.com>
Co-authored-by: Tong Mu <dkwingsmt@users.noreply.github.com>
This is my attempt to handle
https://github.com/flutter/flutter/issues/6537 for the Stepper widget.
---------
Co-authored-by: Victor Sanni <victorsanniay@gmail.com>
Co-authored-by: Tong Mu <dkwingsmt@users.noreply.github.com>
This is my attempt to handle
https://github.com/flutter/flutter/issues/6537 for the
UserAccountsDrawerHeader widget.
Co-authored-by: Victor Sanni <victorsanniay@gmail.com>
Co-authored-by: Tong Mu <dkwingsmt@users.noreply.github.com>
This is my attempt to handle
https://github.com/flutter/flutter/issues/6537 for the TimePickerDialog
widget.
Co-authored-by: Tong Mu <dkwingsmt@users.noreply.github.com>
Co-authored-by: Victor Sanni <victorsanniay@gmail.com>
This is my attempt to handle
https://github.com/flutter/flutter/issues/6537 for the
TextSelectionToolbarTextButton widget.
Co-authored-by: Tong Mu <dkwingsmt@users.noreply.github.com>
Co-authored-by: Victor Sanni <victorsanniay@gmail.com>
This is my attempt to handle
https://github.com/flutter/flutter/issues/6537 for the TabBar widget.
---------
Co-authored-by: Tong Mu <dkwingsmt@users.noreply.github.com>
Co-authored-by: Victor Sanni <victorsanniay@gmail.com>
This is my attempt to handle
https://github.com/flutter/flutter/issues/6537 for the ToggleButtons
widget.
Co-authored-by: Tong Mu <dkwingsmt@users.noreply.github.com>
Co-authored-by: Victor Sanni <victorsanniay@gmail.com>
<!-- start_original_pr_link -->
Reverts: flutter/flutter#177570
<!-- end_original_pr_link -->
<!-- start_initiating_author -->
Initiated by: chingjun
<!-- end_initiating_author -->
<!-- start_revert_reason -->
Reason for reverting: Broke internal tests.
<!-- end_revert_reason -->
<!-- start_original_pr_author -->
Original PR Author: flutter-zl
<!-- end_original_pr_author -->
<!-- start_reviewers -->
Reviewed By: {chunhtai}
<!-- end_reviewers -->
<!-- start_revert_body -->
This change reverts the following previous change:
Fix premature dialog dismissal on Flutter Web when semantics are enabled
by correctly propagating hitTestBehavior through the semantics pipeline
and declaring modal routes as opaque to pointer events.
Before change
https://dialog-dismiss-before.web.app/
Click on the "Show Dialog" button.
Click anywhere inside the dialog that is not a form field.
Observe the dialog being dismissed.
After change
https://dialog-dimiss-after.web.app/
Click on the "Show Dialog" button.
Click anywhere inside the dialog that is not a form field.
Observe the dialog not dismissed.
Fixes: #149001
Engine work: #176974
<!-- end_revert_body -->
Co-authored-by: auto-submit[bot] <flutter-engprod-team@google.com>
Fix premature dialog dismissal on Flutter Web when semantics are enabled
by correctly propagating hitTestBehavior through the semantics pipeline
and declaring modal routes as opaque to pointer events.
Before change
https://dialog-dismiss-before.web.app/
Click on the "Show Dialog" button.
Click anywhere inside the dialog that is not a form field.
Observe the dialog being dismissed.
After change
https://dialog-dimiss-after.web.app/
Click on the "Show Dialog" button.
Click anywhere inside the dialog that is not a form field.
Observe the dialog not dismissed.
Fixes: #149001
Engine work: #176974
## Description
This PR adds `DropdownMenuFormField.decorationBuilder` and passes it to
the underlying `DropdownMenu`.
## Related Issue
Follow-up to https://github.com/flutter/flutter/pull/176264 which added
`DropdownMenu.decorationBuilder`.
## Tests
- Adds 1 test.
<!-- start_original_pr_link -->
Reverts: flutter/flutter#165173
<!-- end_original_pr_link -->
<!-- start_initiating_author -->
Initiated by: chingjun
<!-- end_initiating_author -->
<!-- start_revert_reason -->
Reason for reverting: The PR did not finish "Google Testing", and
actually caused several failures in Google
<!-- end_revert_reason -->
<!-- start_original_pr_author -->
Original PR Author: rkishan516
<!-- end_original_pr_author -->
<!-- start_reviewers -->
Reviewed By: {chunhtai, flutter-zl}
<!-- end_reviewers -->
<!-- start_revert_body -->
This change reverts the following previous change:
Feat: Add a11y for loading indicators
fixes: #161631
## Pre-launch Checklist
- [x] I read the [Contributor Guide] and followed the process outlined
there for submitting PRs.
- [x] I read the [Tree Hygiene] wiki page, which explains my
responsibilities.
- [x] I read and followed the [Flutter Style Guide], including [Features
we expect every widget to implement].
- [x] I signed the [CLA].
- [x] I listed at least one issue that this PR fixes in the description
above.
- [x] I updated/added relevant documentation (doc comments with `///`).
- [x] I added new tests to check the change I am making, or this PR is
[test-exempt].
- [x] I followed the [breaking change policy] and added [Data Driven
Fixes] where supported.
- [x] All existing and new tests are passing.
<!-- end_revert_body -->
Co-authored-by: auto-submit[bot] <flutter-engprod-team@google.com>
Feat: Add a11y for loading indicators
fixes: #161631
## Pre-launch Checklist
- [x] I read the [Contributor Guide] and followed the process outlined
there for submitting PRs.
- [x] I read the [Tree Hygiene] wiki page, which explains my
responsibilities.
- [x] I read and followed the [Flutter Style Guide], including [Features
we expect every widget to implement].
- [x] I signed the [CLA].
- [x] I listed at least one issue that this PR fixes in the description
above.
- [x] I updated/added relevant documentation (doc comments with `///`).
- [x] I added new tests to check the change I am making, or this PR is
[test-exempt].
- [x] I followed the [breaking change policy] and added [Data Driven
Fixes] where supported.
- [x] All existing and new tests are passing.
This is my attempt to handle
https://github.com/flutter/flutter/issues/6537 for the RefreshIndicator
widget.
---------
Co-authored-by: Tong Mu <dkwingsmt@users.noreply.github.com>
Co-authored-by: Victor Sanni <victorsanniay@gmail.com>
Fixes https://github.com/flutter/flutter/issues/177009
### Description
- Moves `MenuButton` submit logic from `onEditingComplete` to
`onSubmitted` to allow `TextField` to handle the `textInputAction` logic
- Wraps each item into `ExcludeFocus` to enable proper
`TextInputAction.previous` handling. If we don't wrap each child in
`ExcludeFocus`, then focus will be moved to one of them, which is not
the expected behavior for `TextInputAction.previous`.
| BEFORE | AFTER |
| - | - |
| <video alt="before"
src="https://github.com/user-attachments/assets/a50d41de-7e54-409b-bf81-80dfb1db132f"
/> | <video alt="after"
src="https://github.com/user-attachments/assets/152e47e6-d774-481c-8478-af526b5f6749"
/> |
<details closed><summary>Code sample</summary>
```dart
import 'package:flutter/material.dart';
void main() {
runApp(const DropdownMenuExample());
}
class DropdownMenuExample extends StatefulWidget {
const DropdownMenuExample({super.key});
@override
State<DropdownMenuExample> createState() => _DropdownMenuExampleState();
}
class _DropdownMenuExampleState extends State<DropdownMenuExample> {
final FocusNode _previousFocusNode = FocusNode(debugLabel: 'previous');
final FocusNode _textFieldFocusNode = FocusNode(debugLabel: 'textField');
final FocusNode _nextFocusNode = FocusNode(debugLabel: 'next');
@override
void dispose() {
_previousFocusNode.dispose();
_textFieldFocusNode.dispose();
_nextFocusNode.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData(colorSchemeSeed: Colors.green),
home: Scaffold(
body: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
spacing: 20,
children: [
TextField(
focusNode: _previousFocusNode,
textInputAction: TextInputAction.next,
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: 'Previous TextField',
),
),
DropdownMenu<String>(
label: Text('Dropdown with filter cannot close keyboard'),
initialSelection: 'green',
focusNode: _textFieldFocusNode,
requestFocusOnTap: true,
showTrailingIcon: false,
textInputAction: TextInputAction.next,
onSelected: (String? color) {
print('SELECTED $color');
},
dropdownMenuEntries: [
DropdownMenuEntry(value: 'red', label: 'red'),
DropdownMenuEntry(value: 'green', label: 'green'),
DropdownMenuEntry(value: 'blue', label: 'blue'),
],
),
TextField(
focusNode: _nextFocusNode,
textInputAction: TextInputAction.done,
decoration: InputDecoration(
border: OutlineInputBorder(),
labelText: 'Next TextField',
),
),
],
),
),
),
);
}
}
```
</details>
There is still one behavior I would like to discuss. When the
`showTrailingIcon: true` and `textInputAction: TextInputAction.previous`
are used, the focus moves not to the previous field but to the
`IconButton`. If we wrap the `IconButton` with `ExcludeFocus`, then this
is fixed, but I am not sure whether this is the correct way to proceed.
| TextInputAction.previous and no ExcludeFocus on IconButton |
TextInputAction.previous and ExcludeFocus on IconButton |
| - | - |
| <video alt="before"
src="https://github.com/user-attachments/assets/76c90dcf-3ea1-492f-8e67-7e987b08c2ff"
/> | <video alt="after"
src="https://github.com/user-attachments/assets/2a1600a2-e308-430e-a12f-acdc06cbf81c"
/> |
## Pre-launch Checklist
- [X] I read the [Contributor Guide] and followed the process outlined
there for submitting PRs.
- [X] I read the [Tree Hygiene] wiki page, which explains my
responsibilities.
- [X] I read and followed the [Flutter Style Guide], including [Features
we expect every widget to implement].
- [X] I signed the [CLA].
- [X] I listed at least one issue that this PR fixes in the description
above.
- [ ] I updated/added relevant documentation (doc comments with `///`).
- [X] I added new tests to check the change I am making, or this PR is
[test-exempt].
- [X] I followed the [breaking change policy] and added [Data Driven
Fixes] where supported.
- [X] All existing and new tests are passing.
<!-- Links -->
[Contributor Guide]:
https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md#overview
[Tree Hygiene]:
https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md
[test-exempt]:
https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md#tests
[Flutter Style Guide]:
https://github.com/flutter/flutter/blob/main/docs/contributing/Style-guide-for-Flutter-repo.md
[Features we expect every widget to implement]:
https://github.com/flutter/flutter/blob/main/docs/contributing/Style-guide-for-Flutter-repo.md#features-we-expect-every-widget-to-implement
[CLA]: https://cla.developers.google.com/
[flutter/tests]: https://github.com/flutter/tests
[breaking change policy]:
https://github.com/flutter/flutter/blob/main/docs/contributing/Tree-hygiene.md#handling-breaking-changes
[Discord]:
https://github.com/flutter/flutter/blob/main/docs/contributing/Chat.md
[Data Driven Fixes]:
https://github.com/flutter/flutter/blob/main/docs/contributing/Data-driven-Fixes.md
## Description
This PR fixes escape key not closing the menu when
`DropdownMenu.requestFocusOnTap` is false.
## Related Issue
Fixes [DropdownMenu menu panel does not close when pressing ESC and
requestFocusOnTap is
false](https://github.com/flutter/flutter/issues/177993)
Part of https://github.com/flutter/flutter/issues/123797
## Tests
- Adds 3 tests.
- Updates 2 non-related tests where I spotted some nits.
This reverts commit ccf6466b14e144971a7d65983bdd16459d65a62a.
~This is a test PR for investigation, the commit seems to be breaking a
customer app.~
The original PR caused b/457553134
