-
Notifications
You must be signed in to change notification settings - Fork 29.7k
Fix expanded DropdownMenu panel is shorter than text field #174443
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix expanded DropdownMenu panel is shorter than text field #174443
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Code Review
This pull request introduces a viewPadding property to the MenuAnchor widget to address an issue where the DropdownMenu panel was shorter than the text field at full-screen width. The changes are well-implemented, exposing the padding property and updating DropdownMenu to use it. The accompanying tests for both MenuAnchor and DropdownMenu are thorough and cover the new functionality and the regression case effectively. I have one minor suggestion to update a comment for better clarity and maintainability.
8107986 to
a8fb881
Compare
QuncCccccc
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
NICE fix! Thank you! LGTM.
| /// The padding between the edge of the safe area and the menu panel. | ||
| /// | ||
| /// Defaults to EdgeInsets.all(8). | ||
| final EdgeInsetsGeometry? viewPadding; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nit: I know viewPadding has been used in _Submenu, but for a public API, I just feel this name is a bit confusing. It sounds like this is the same as MenuStyle.padding. How about reservedPadding? Please let me know if there are more name proposals!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
reservedPadding seems great to me!
I will push a commit asap.
a8fb881 to
d17b1c1
Compare
Roll Flutter from 6b18740d5a23 to 87d5b753196c (88 revisions) flutter/flutter@6b18740...87d5b75 2025-09-05 [email protected] [ Device Lab ] Add regression testing for flutter/flutter#174952 (flutter/flutter#174956) 2025-09-05 [email protected] Roll Skia from 0ca53adfc6cc to 845ec125e94c (2 revisions) (flutter/flutter#174978) 2025-09-05 [email protected] [a11y-app] Fix NavigationRail leading and trailing labels (flutter/flutter#174861) 2025-09-05 [email protected] Roll Skia from d7e99be07d5d to 0ca53adfc6cc (5 revisions) (flutter/flutter#174972) 2025-09-05 [email protected] Roll Fuchsia Linux SDK from izfNA3o_2zL4Cjqmy... to xG_uERsxHvUwFHpF2... (flutter/flutter#174970) 2025-09-04 [email protected] Fix IconButton.color overrided by IconButtomTheme (flutter/flutter#174515) 2025-09-04 [email protected] [web] Reuse chrome instance to run all flutter tests (flutter/flutter#174957) 2025-09-04 [email protected] fix(Semantics): Ensure semantics properties take priority over button's (flutter/flutter#174473) 2025-09-04 [email protected] Make every LLDB Init error message actionable (flutter/flutter#174726) 2025-09-04 [email protected] Fix table cell semantics rect alignment issues. (flutter/flutter#174914) 2025-09-04 [email protected] Fix: Use route navigator for CupertinoSheetRoute pop (flutter/flutter#173103) 2025-09-04 [email protected] [ Widget Preview] Add `group` property to `Preview` (flutter/flutter#174849) 2025-09-04 [email protected] Allow OverlayPortal.overlayChildLayoutBuilder to choose root Overlay (flutter/flutter#174239) 2025-09-04 [email protected] Roll Skia from 7c2f502e3304 to d7e99be07d5d (18 revisions) (flutter/flutter#174936) 2025-09-04 [email protected] Remove 'terms of use' wording from web_unicode (flutter/flutter#174939) 2025-09-04 [email protected] [ Tool ] Remove leftover Android x86 deprecation warning constant (flutter/flutter#174941) 2025-09-04 [email protected] Prevent potential crash when accessing window in FlutterSceneDelegate (flutter/flutter#174873) 2025-09-04 [email protected] Roll Packages from 42bb347 to 98580c6 (5 revisions) (flutter/flutter#174943) 2025-09-04 [email protected] [ Device Lab ] Fix wakefulness check to only match log entries with string values (flutter/flutter#174953) 2025-09-04 [email protected] Fix expanded DropdownMenu panel is shorter than text field (flutter/flutter#174443) 2025-09-04 [email protected] Add a `viewController` property to the ios/macOS `FlutterPluginRegistrar` protocol (flutter/flutter#174168) 2025-09-03 [email protected] Roll Fuchsia Linux SDK from J3T_wZqL_57mRfWky... to izfNA3o_2zL4Cjqmy... (flutter/flutter#174908) 2025-09-03 [email protected] Wires up Android API to set section locale (flutter/flutter#173364) 2025-09-03 [email protected] Delete impeller::SPrintF. (flutter/flutter#174900) 2025-09-03 [email protected] Make sure that a DropdownMenuFormField doesn't crash in 0x0 environment (flutter/flutter#174777) 2025-09-03 [email protected] Remove unnecessary `presubmit_max_attempts` from .ci.yaml (flutter/flutter#174885) 2025-09-03 [email protected] Use local canvaskit in `dart_data_asset_test.dart` (flutter/flutter#174891) 2025-09-03 98614782+auto-submit[bot]@users.noreply.github.com Reverts "Mark Linux web_canvaskit_tests_7_last as bringup (#174878)" (flutter/flutter#174897) 2025-09-03 [email protected] Correct intrinsics calculation for CupertinoTextField with placeholder (flutter/flutter#174889) 2025-09-03 [email protected] Considers large title height in CupertinoNavigationBar's preferred size (flutter/flutter#173722) 2025-09-03 [email protected] [A11y] Add semantics for CupertinoExpansionTile (flutter/flutter#174480) 2025-09-03 [email protected] Fix LinearProgressIndicator track painting. (flutter/flutter#173108) 2025-09-03 [email protected] update triage documentation to include team-android (flutter/flutter#174850) 2025-09-03 [email protected] Update `test_timeout_secs` to match `timeout` for `Linux web_skwasm_tests_*` and `Linux web_canvaskit_tests_*` (flutter/flutter#174881) 2025-09-03 [email protected] Roll Packages from 5d785a0 to 42bb347 (10 revisions) (flutter/flutter#174876) 2025-09-03 [email protected] Fixup formatting of gn files in the old buildroot. (flutter/flutter#174852) 2025-09-03 [email protected] Roll Dart SDK to 3.10.0-162.1.beta (flutter/flutter#174834) 2025-09-03 [email protected] Mark Linux web_canvaskit_tests_7_last as bringup (flutter/flutter#174878) 2025-09-02 [email protected] [Impeller] Fix overdraw in DrawRect geometry (flutter/flutter#174735) 2025-09-02 [email protected] Patch .clang-format files to specify C++20. (flutter/flutter#174848) 2025-09-02 [email protected] Add data assets (flutter/flutter#174685) 2025-09-02 [email protected] refactors `FlutterPlugin.kt` to use one line statement in the `into` bloc (flutter/flutter#174759) 2025-09-02 [email protected] Ensures initial semantics state is sent to engine (flutter/flutter#174845) 2025-09-02 [email protected] [Android] Break up plugin_test integration tests (flutter/flutter#174728) 2025-09-02 [email protected] Fix: Assertion failure in RawScrollbarState with dynamic controller assignment (flutter/flutter#173156) 2025-09-02 [email protected] Roll Skia from 359f3d7cc7ed to 7c2f502e3304 (1 revision) (flutter/flutter#174844) ...
…74443) ## Description This PR fixes DropdownMenu menu panel being shorter than the TextField when it expands to full-screen width. ## Before The menu panel is shorter than the text field: <img width="297" height="130" alt="image" src="https://github.com/user-attachments/assets/db42bd01-94d8-47fb-9331-ebd78111b931" /> ## After The menu panel expands as close as possible to the edge similarly to the text field. <img width="297" height="130" alt="image" src="https://github.com/user-attachments/assets/b7d8f2aa-a668-439a-8195-9b9ce48dba6b" /> ## Code sample <details><summary>Code sample for recordings</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> { @OverRide Widget build(BuildContext context) { return const MaterialApp( debugShowCheckedModeBanner: false, home: Scaffold( body: DropdownMenu<int>( expandedInsets: EdgeInsets.zero, dropdownMenuEntries: <DropdownMenuEntry<int>>[ DropdownMenuEntry<int>(value: 0, label: 'Flutter'), ], ), ), ); } } ``` </details> ## Implementation details MenuAnchor automatically adds a default padding, see https://github.com/flutter/flutter/blob/2c21273bfde5da921df512034f30ff7fd042db97/packages/flutter/lib/src/material/menu_anchor.dart#L81-L82 This PR add a property to menu anchor to expose the view padding. DropdownMenu sets this padding to EdgeInsets.zero to opt-out from the default 8 padding. ## Related Issue Fixes [DropdownMenu children is shorter than the TextField when it expands to full-screen width](flutter#172680) ## Tests Adds 2 tests. --------- Co-authored-by: Qun Cheng <[email protected]>
…74443) ## Description This PR fixes DropdownMenu menu panel being shorter than the TextField when it expands to full-screen width. ## Before The menu panel is shorter than the text field: <img width="297" height="130" alt="image" src="https://github.com/user-attachments/assets/db42bd01-94d8-47fb-9331-ebd78111b931" /> ## After The menu panel expands as close as possible to the edge similarly to the text field. <img width="297" height="130" alt="image" src="https://github.com/user-attachments/assets/b7d8f2aa-a668-439a-8195-9b9ce48dba6b" /> ## Code sample <details><summary>Code sample for recordings</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> { @OverRide Widget build(BuildContext context) { return const MaterialApp( debugShowCheckedModeBanner: false, home: Scaffold( body: DropdownMenu<int>( expandedInsets: EdgeInsets.zero, dropdownMenuEntries: <DropdownMenuEntry<int>>[ DropdownMenuEntry<int>(value: 0, label: 'Flutter'), ], ), ), ); } } ``` </details> ## Implementation details MenuAnchor automatically adds a default padding, see https://github.com/flutter/flutter/blob/2c21273bfde5da921df512034f30ff7fd042db97/packages/flutter/lib/src/material/menu_anchor.dart#L81-L82 This PR add a property to menu anchor to expose the view padding. DropdownMenu sets this padding to EdgeInsets.zero to opt-out from the default 8 padding. ## Related Issue Fixes [DropdownMenu children is shorter than the TextField when it expands to full-screen width](flutter#172680) ## Tests Adds 2 tests. --------- Co-authored-by: Qun Cheng <[email protected]>
…r#9962) Roll Flutter from 6b18740d5a23 to 87d5b753196c (88 revisions) flutter/flutter@6b18740...87d5b75 2025-09-05 [email protected] [ Device Lab ] Add regression testing for flutter/flutter#174952 (flutter/flutter#174956) 2025-09-05 [email protected] Roll Skia from 0ca53adfc6cc to 845ec125e94c (2 revisions) (flutter/flutter#174978) 2025-09-05 [email protected] [a11y-app] Fix NavigationRail leading and trailing labels (flutter/flutter#174861) 2025-09-05 [email protected] Roll Skia from d7e99be07d5d to 0ca53adfc6cc (5 revisions) (flutter/flutter#174972) 2025-09-05 [email protected] Roll Fuchsia Linux SDK from izfNA3o_2zL4Cjqmy... to xG_uERsxHvUwFHpF2... (flutter/flutter#174970) 2025-09-04 [email protected] Fix IconButton.color overrided by IconButtomTheme (flutter/flutter#174515) 2025-09-04 [email protected] [web] Reuse chrome instance to run all flutter tests (flutter/flutter#174957) 2025-09-04 [email protected] fix(Semantics): Ensure semantics properties take priority over button's (flutter/flutter#174473) 2025-09-04 [email protected] Make every LLDB Init error message actionable (flutter/flutter#174726) 2025-09-04 [email protected] Fix table cell semantics rect alignment issues. (flutter/flutter#174914) 2025-09-04 [email protected] Fix: Use route navigator for CupertinoSheetRoute pop (flutter/flutter#173103) 2025-09-04 [email protected] [ Widget Preview] Add `group` property to `Preview` (flutter/flutter#174849) 2025-09-04 [email protected] Allow OverlayPortal.overlayChildLayoutBuilder to choose root Overlay (flutter/flutter#174239) 2025-09-04 [email protected] Roll Skia from 7c2f502e3304 to d7e99be07d5d (18 revisions) (flutter/flutter#174936) 2025-09-04 [email protected] Remove 'terms of use' wording from web_unicode (flutter/flutter#174939) 2025-09-04 [email protected] [ Tool ] Remove leftover Android x86 deprecation warning constant (flutter/flutter#174941) 2025-09-04 [email protected] Prevent potential crash when accessing window in FlutterSceneDelegate (flutter/flutter#174873) 2025-09-04 [email protected] Roll Packages from 42bb347 to 98580c6 (5 revisions) (flutter/flutter#174943) 2025-09-04 [email protected] [ Device Lab ] Fix wakefulness check to only match log entries with string values (flutter/flutter#174953) 2025-09-04 [email protected] Fix expanded DropdownMenu panel is shorter than text field (flutter/flutter#174443) 2025-09-04 [email protected] Add a `viewController` property to the ios/macOS `FlutterPluginRegistrar` protocol (flutter/flutter#174168) 2025-09-03 [email protected] Roll Fuchsia Linux SDK from J3T_wZqL_57mRfWky... to izfNA3o_2zL4Cjqmy... (flutter/flutter#174908) 2025-09-03 [email protected] Wires up Android API to set section locale (flutter/flutter#173364) 2025-09-03 [email protected] Delete impeller::SPrintF. (flutter/flutter#174900) 2025-09-03 [email protected] Make sure that a DropdownMenuFormField doesn't crash in 0x0 environment (flutter/flutter#174777) 2025-09-03 [email protected] Remove unnecessary `presubmit_max_attempts` from .ci.yaml (flutter/flutter#174885) 2025-09-03 [email protected] Use local canvaskit in `dart_data_asset_test.dart` (flutter/flutter#174891) 2025-09-03 98614782+auto-submit[bot]@users.noreply.github.com Reverts "Mark Linux web_canvaskit_tests_7_last as bringup (#174878)" (flutter/flutter#174897) 2025-09-03 [email protected] Correct intrinsics calculation for CupertinoTextField with placeholder (flutter/flutter#174889) 2025-09-03 [email protected] Considers large title height in CupertinoNavigationBar's preferred size (flutter/flutter#173722) 2025-09-03 [email protected] [A11y] Add semantics for CupertinoExpansionTile (flutter/flutter#174480) 2025-09-03 [email protected] Fix LinearProgressIndicator track painting. (flutter/flutter#173108) 2025-09-03 [email protected] update triage documentation to include team-android (flutter/flutter#174850) 2025-09-03 [email protected] Update `test_timeout_secs` to match `timeout` for `Linux web_skwasm_tests_*` and `Linux web_canvaskit_tests_*` (flutter/flutter#174881) 2025-09-03 [email protected] Roll Packages from 5d785a0 to 42bb347 (10 revisions) (flutter/flutter#174876) 2025-09-03 [email protected] Fixup formatting of gn files in the old buildroot. (flutter/flutter#174852) 2025-09-03 [email protected] Roll Dart SDK to 3.10.0-162.1.beta (flutter/flutter#174834) 2025-09-03 [email protected] Mark Linux web_canvaskit_tests_7_last as bringup (flutter/flutter#174878) 2025-09-02 [email protected] [Impeller] Fix overdraw in DrawRect geometry (flutter/flutter#174735) 2025-09-02 [email protected] Patch .clang-format files to specify C++20. (flutter/flutter#174848) 2025-09-02 [email protected] Add data assets (flutter/flutter#174685) 2025-09-02 [email protected] refactors `FlutterPlugin.kt` to use one line statement in the `into` bloc (flutter/flutter#174759) 2025-09-02 [email protected] Ensures initial semantics state is sent to engine (flutter/flutter#174845) 2025-09-02 [email protected] [Android] Break up plugin_test integration tests (flutter/flutter#174728) 2025-09-02 [email protected] Fix: Assertion failure in RawScrollbarState with dynamic controller assignment (flutter/flutter#173156) 2025-09-02 [email protected] Roll Skia from 359f3d7cc7ed to 7c2f502e3304 (1 revision) (flutter/flutter#174844) ...
…74443) ## Description This PR fixes DropdownMenu menu panel being shorter than the TextField when it expands to full-screen width. ## Before The menu panel is shorter than the text field: <img width="297" height="130" alt="image" src="https://github.com/user-attachments/assets/db42bd01-94d8-47fb-9331-ebd78111b931" /> ## After The menu panel expands as close as possible to the edge similarly to the text field. <img width="297" height="130" alt="image" src="https://github.com/user-attachments/assets/b7d8f2aa-a668-439a-8195-9b9ce48dba6b" /> ## Code sample <details><summary>Code sample for recordings</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> { @OverRide Widget build(BuildContext context) { return const MaterialApp( debugShowCheckedModeBanner: false, home: Scaffold( body: DropdownMenu<int>( expandedInsets: EdgeInsets.zero, dropdownMenuEntries: <DropdownMenuEntry<int>>[ DropdownMenuEntry<int>(value: 0, label: 'Flutter'), ], ), ), ); } } ``` </details> ## Implementation details MenuAnchor automatically adds a default padding, see https://github.com/flutter/flutter/blob/2c21273bfde5da921df512034f30ff7fd042db97/packages/flutter/lib/src/material/menu_anchor.dart#L81-L82 This PR add a property to menu anchor to expose the view padding. DropdownMenu sets this padding to EdgeInsets.zero to opt-out from the default 8 padding. ## Related Issue Fixes [DropdownMenu children is shorter than the TextField when it expands to full-screen width](flutter#172680) ## Tests Adds 2 tests. --------- Co-authored-by: Qun Cheng <[email protected]>
Description
This PR fixes DropdownMenu menu panel being shorter than the TextField when it expands to full-screen width.
Before
The menu panel is shorter than the text field:
After
The menu panel expands as close as possible to the edge similarly to the text field.
Code sample
Code sample for recordings
Implementation details
MenuAnchor automatically adds a default padding, see
flutter/packages/flutter/lib/src/material/menu_anchor.dart
Lines 81 to 82 in 2c21273
This PR add a property to menu anchor to expose the view padding.
DropdownMenu sets this padding to EdgeInsets.zero to opt-out from the default 8 padding.
Related Issue
Fixes DropdownMenu children is shorter than the TextField when it expands to full-screen width
Tests
Adds 2 tests.