Skip to content

Conversation

@bleroux
Copy link
Contributor

@bleroux bleroux commented Aug 26, 2025

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:

image

After

The menu panel expands as close as possible to the edge similarly to the text field.

image

Code sample

Code sample for recordings
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'),
          ],
        ),
      ),
    );
  }
}

Implementation details

MenuAnchor automatically adds a default padding, see

// How close to the edge of the safe area the menu will be placed.
const double _kMenuViewPadding = 8;

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.

@github-actions github-actions bot added framework flutter/packages/flutter repository. See also f: labels. f: material design flutter/packages/flutter/material repository. labels Aug 26, 2025
Copy link
Contributor

@gemini-code-assist gemini-code-assist bot left a 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.

@bleroux bleroux requested a review from QuncCccccc August 26, 2025 17:58
@bleroux bleroux force-pushed the fix_dropdown_menu_panel_is_shorter_than_text_field branch from 8107986 to a8fb881 Compare September 1, 2025 06:42
Copy link
Contributor

@QuncCccccc QuncCccccc left a 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;
Copy link
Contributor

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!

Copy link
Contributor Author

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.

@QuncCccccc QuncCccccc changed the title Fix DropdownMenu panel is shorter than text field Fix expanded DropdownMenu panel is shorter than text field Sep 3, 2025
@bleroux bleroux force-pushed the fix_dropdown_menu_panel_is_shorter_than_text_field branch from a8fb881 to d17b1c1 Compare September 3, 2025 09:15
@bleroux bleroux added the autosubmit Merge PR when tree becomes green via auto submit App label Sep 4, 2025
@auto-submit auto-submit bot added this pull request to the merge queue Sep 4, 2025
Merged via the queue into flutter:master with commit 6e9286d Sep 4, 2025
77 checks passed
@flutter-dashboard flutter-dashboard bot removed the autosubmit Merge PR when tree becomes green via auto submit App label Sep 4, 2025
@bleroux bleroux deleted the fix_dropdown_menu_panel_is_shorter_than_text_field branch September 4, 2025 07:22
auto-submit bot pushed a commit to flutter/packages that referenced this pull request Sep 5, 2025
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)
...
mboetger pushed a commit to mboetger/flutter that referenced this pull request Sep 18, 2025
…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]>
Jaineel-Mamtora pushed a commit to Jaineel-Mamtora/flutter_forked that referenced this pull request Sep 24, 2025
…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]>
danferreira pushed a commit to danferreira/packages that referenced this pull request Oct 22, 2025
…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)
...
lucaantonelli pushed a commit to lucaantonelli/flutter that referenced this pull request Nov 21, 2025
…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]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

f: material design flutter/packages/flutter/material repository. framework flutter/packages/flutter repository. See also f: labels.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

DropdownMenu children is shorter than the TextField when it expands to full-screen width

2 participants