[material_ui] Fix MenuAnchor scrollbar safe-area padding by abdullahtas0 · Pull Request #12470 · flutter/packages

abdullahtas0 · 2026-08-13T21:38:57Z

Material Scrollbar uses the surrounding MediaQuery.padding as painter padding when no explicit padding is provided. A MenuAnchor overlay is already positioned within the safe area, so inheriting the view padding again shortens the scrollbar track and prevents the thumb from reaching its visual end.

This change removes safe-area padding only for the menu's Scrollbar, then restores the original MediaQueryData below it so custom menu children continue to observe the same media query values as before. It also adds a regression test and a patch changelog entry.

Fixes flutter/flutter#188155.

This supersedes flutter/flutter#191085, which cannot land in flutter/flutter because Material framework changes have moved to material_ui.

Validation:

The regression test failed before the source change with a 24 logical pixel bottom scrollbar padding and passes after the change.
flutter test test/menu_anchor_test.dart (171 passed, 1 skipped)
flutter analyze --no-pub
flutter_plugin_tools format --packages=material_ui
flutter_plugin_tools validate --packages=material_ui --check-for-missing-changes

Pre-Review Checklist

If you need help, consider asking for advice on the #hackers-new channel on Discord.

Note: The Flutter team is currently trialing the use of Gemini Code Assist for GitHub. Comments from the gemini-code-assist bot should not be taken as authoritative feedback from the Flutter team. If you find its comments useful you can update your code accordingly, but if you are unsure or disagree with the feedback, please feel free to wait for a Flutter team member's review for guidance on which automated comments should be addressed.

Regular contributors who have demonstrated familiarity with the repository guidelines only need to comment if the PR is not auto-exempted by repo tooling. ↩ ↩²

google-cla · 2026-08-13T21:39:15Z

Thanks for your pull request! It looks like this may be your first contribution to a Google open source project. Before we can look at your pull request, you'll need to sign a Contributor License Agreement (CLA).

View this failed invocation of the CLA check for more information.

For the most up to date status, view the checks section at the bottom of the pull request.

gemini-code-assist

Code Review

This pull request prevents MenuAnchor scrollbars from inheriting system safe-area padding by removing padding from the MediaQuery surrounding the Scrollbar and restoring it for the inner scroll view. A regression test and a changelog entry are also included. The feedback suggests optimizing the implementation by using mediaQuery.removePadding(...) directly on the already retrieved MediaQueryData instance, avoiding redundant MediaQuery.of(context) lookups.

elliette · 2026-08-24T23:13:56Z

    final EdgeInsetsGeometry padding =
        resolve<EdgeInsetsGeometry?>((MenuStyle? style) => style?.padding) ?? EdgeInsets.zero;
    final Offset densityAdjustment = visualDensity.baseSizeAdjustment;
+    final MediaQueryData mediaQuery = MediaQuery.of(context);


Thank you! Removing the system padding for just the scrollbar looks good to me. To make it clear why we are doing so, do you mind adding a comment here and renaming the two MediaQuery instances to something like ambientMediaQuery and scrollbarMediaQuery?

Done. Added a comment explaining why the padding is dropped for the scrollbar, and renamed the values to ambientMediaQuery and scrollbarMediaQuery.

elliette · 2026-08-24T23:15:41Z

+  testWidgets('Menu scrollbar does not inherit MediaQuery padding', (WidgetTester tester) async {
+    addTearDown(tester.view.reset);
+    tester.view.devicePixelRatio = 1.0;
+    tester.view.padding = const FakeViewPadding(bottom: 24.0);


Maybe add padding on all four sides to verify they are all removed for the scrollbar but retained on menuItemPadding.

Done. The view padding is now FakeViewPadding(left: 8, top: 16, right: 32, bottom: 24), and the test asserts scrollbarPainter.padding is EdgeInsets.zero while menuItemPadding is still EdgeInsets.fromLTRB(8, 16, 32, 24). Without the source change the painter padding comes back as EdgeInsets(8.0, 16.0, 32.0, 24.0).

elliette · 2026-08-24T23:20:02Z

  }, variant: TargetPlatformVariant.desktop());

+  // Regression test for https://github.com/flutter/flutter/issues/188155.
+  testWidgets('Menu scrollbar does not inherit MediaQuery padding', (WidgetTester tester) async {


Consider testing that we can scroll all the way to the bottom as well since the issue mentions the scrollbar getting stuck there.

Done. The test now drags the menu to the end and asserts position.pixels == position.maxScrollExtent, then checks that the painted thumb ends at the bottom of the scrollbar box. I verified that last assertion is not vacuous: with the source change reverted it fails on its own, because the track stops 24 logical pixels short and the thumb never reaches the end.

abdullahtas0 · 2026-08-25T10:08:53Z

Thanks for the review @elliette — all three comments are addressed, and the branch is rebased onto current main.

Validation on the new head:

flutter test test/menu_anchor_test.dart — 171 passed, 1 skipped
flutter test --platform chrome --wasm test/menu_anchor_test.dart — 164 passed, 8 skipped
flutter test for dropdown_menu, dropdown_menu_theme, dropdown_menu_form_field, menu_theme, menu_style, menu_bar_theme and popup_menu — 374 passed
flutter analyze --no-pub — no issues
dart format --set-exit-if-changed — clean

Reverting only the menu_anchor.dart change makes the regression test fail again, both on the padding assertion and on the new thumb assertion.

One note on CI: the only red job on the previous run was Linux_web web_dart_unit_test_wasm_shard_1 master, which came back as INFRA_FAILURE ("The build was cancelled") rather than a test failure. That builder cancelled or failed on several unrelated commits over the same window, and the file passes locally under --platform chrome --wasm.

The push also cleared the CICD label, and I do not have permission to add it back — could you re-apply it when you get a chance so presubmit runs on the new head?

QuncCccccc

LGTM. Thanks for the fix!

QuncCccccc · 2026-09-14T23:05:15Z

+    // Material's Scrollbar uses the ambient MediaQuery padding as its painter
+    // padding when no explicit padding is given, so that the thumb clears
+    // system intrusions such as a gesture bar. The menu overlay is already
+    // positioned inside the safe area, so honoring that padding a second time
+    // shortens the scrollbar track and stops the thumb from reaching the end of
+    // the menu. The padding is therefore removed for the Scrollbar only and
+    // restored below it, so menu children keep observing the ambient values.


Suggested change

// Material's Scrollbar uses the ambient MediaQuery padding as its painter

// padding when no explicit padding is given, so that the thumb clears

// system intrusions such as a gesture bar. The menu overlay is already

// positioned inside the safe area, so honoring that padding a second time

// shortens the scrollbar track and stops the thumb from reaching the end of

// the menu. The padding is therefore removed for the Scrollbar only and

// restored below it, so menu children keep observing the ambient values.

// Scrollbar uses the `MadiaQuery.padding` as its painter

// padding by default. Menu overlays are already

// positioned within the safe area, so applying that padding again

// shortens the scrollbar track and stops the thumb from reaching the end of

// the menu. Remove the padding only for the Scrollbar and restore the ambient MediaQuery for menu children.

Thanks for the suggestion. I left the existing comment in place: this wording uses MadiaQuery, and the current comment already explains why the padding is removed only for the scrollbar.

I did not push a follow-up. This head is approved with green CI, and a new push clears the CICD label, which I cannot restore. Happy to apply a corrected comment if you want that wording — it would need CICD added again. Otherwise this looks ready to land.

Please update the comment to reflect @QuncCccccc's suggestion. MadiaQuery is a typo, it should be MediaQuery. We will re-add the CICD label after.

Done in 0f6d17b — the comment now uses @QuncCccccc's wording, with the typo fixed to MediaQuery.padding and the lines rewrapped to 80 columns. No code changes; menu_anchor_test.dart still passes (171 passed, 1 skipped) and dart format / flutter analyze are clean.

Thanks for re-adding CICD!

Explain why the menu Scrollbar drops the ambient MediaQuery padding and name the two MediaQueryData values after their roles. Extend the regression test to pad all four sides, and assert that the menu still scrolls to the very bottom with the scrollbar thumb reaching the end of its track.

elliette

Thanks for your patience! Looks good

flutter/packages@93baed9...108dad0 2026-10-22 [email protected] [material_ui] Migrate M3 IconButton template to use new gen_defaults (flutter/packages#12922) 2026-10-22 [email protected] [material_ui] Migrate M3 NavigationBar template to use new gen_defaults (flutter/packages#13067) 2026-10-22 [email protected] [material_ui] Remove obsolete `SurfaceTint` defaults template (flutter/packages#13276) 2026-10-22 [email protected] [material_ui] Migrate M3 Radio template to use new gen_defaults (flutter/packages#13210) 2026-10-22 [email protected] [material_ui] Migrate M3 NavigationDrawer template to use new gen_defaults (flutter/packages#13068) 2026-10-22 [email protected] [image_picker_ios] PR 3/5 Split SPM packaging and migrate the plugin class to Swift (flutter/packages#13235) 2026-10-22 [email protected] [ci] Increase check-discovery timeout in release workflows (flutter/packages#13392) 2026-10-22 [email protected] [material_ui] Migrate M3 `Switch` template to use new gen_defaults (flutter/packages#13274) 2026-10-22 [email protected] [material_ui] Migrate M3 PopupMenu template to use new gen_defaults (flutter/packages#13209) 2026-10-22 [email protected] [material_ui] Add day and weekday builders to CalendarDatePicker and showDatePicker (flutter/packages#12587) 2026-10-22 [email protected] [material_ui] Migrate M3 `SearchView` template to use new gen_defaults (flutter/packages#13272) 2026-10-22 [email protected] [material_ui] Migrate M3 `TextField` template to use new gen_defaults (flutter/packages#13275) 2026-10-22 [email protected] [material_ui] Migrate M3 RangeSlider template to use new gen_defaults (flutter/packages#13215) 2026-10-22 [email protected] [go_router] Keep web autocomplete focused in shell routes (flutter/packages#13348) 2026-10-22 [email protected] [shared_preferences_android] Fix web compilation of apps that import the package (flutter/packages#13380) 2026-10-22 [email protected] [material_ui] Migrate M3 NavigationRail template to use new gen_defaults (flutter/packages#13069) 2026-10-22 [email protected] [material_ui] Migrate M3 SearchBar template to use new gen_defaults (flutter/packages#13216) 2026-10-22 [email protected] [material_ui] Fix for time picker error in locales that do not use Latin digits (flutter/packages#13035) 2026-10-22 [email protected] [material_ui] Fix MenuAnchor scrollbar safe-area padding (flutter/packages#12470) 2026-10-22 [email protected] [material_ui] Document Material 3 fallback for Divider.color and VerticalDivider.color (flutter/packages#12967) 2026-10-22 [email protected] [material_ui] Migrate M3 tabs template to use new gen_defaults (flutter/packages#13139) 2026-10-22 [email protected] [material_ui] Migrate M3 progress indicator defaults to new gen_defaults (flutter/packages#13026) 2026-10-22 [email protected] [google_sign_in] Convert the iOS example app and UI tests to Swift (flutter/packages#13271) If this roll has caused a breakage, revert this CL and set the roller to dry run mode using the controls here: https://autoroll.skia.org/r/flutter-packages-flutter-autoroll Please CC [email protected] on the revert to ensure that a human is aware of the problem. To file a bug in Flutter: https://github.com/flutter/flutter/issues/new/choose To report a problem with the AutoRoller itself, please file a bug: https://issues.skia.org/issues/new?component=1389291&template=1850622 Documentation for the AutoRoller is here: https://skia.googlesource.com/buildbot/+doc/main/autoroll/README.md

github-actions Bot added triage-framework Should be looked at in framework triage p: material_ui labels Aug 13, 2026

abdullahtas0 mentioned this pull request Aug 13, 2026

Fix MenuAnchor scrollbar safe area padding flutter/flutter#191085

Closed

5 of 10 tasks

abdullahtas0 marked this pull request as ready for review August 13, 2026 21:44

gemini-code-assist Bot reviewed Aug 13, 2026

View reviewed changes

Comment thread packages/material_ui/lib/src/menu_anchor.dart Resolved

Piinks added triage-design Should be looked at in design triage and removed triage-framework Should be looked at in framework triage labels Aug 17, 2026

dkwingsmt requested review from QuncCccccc and elliette August 19, 2026 18:34

elliette added the CICD Run CI/CD label Aug 24, 2026

elliette reviewed Aug 24, 2026

View reviewed changes

abdullahtas0 force-pushed the agent/fix-menu-anchor-scrollbar-padding branch from 3db34ec to bdc4cc4 Compare August 25, 2026 10:08

flutter-dashboard Bot removed the CICD Run CI/CD label Aug 25, 2026

elliette added the CICD Run CI/CD label Aug 25, 2026

QuncCccccc approved these changes Sep 14, 2026

View reviewed changes

flutter-dashboard Bot removed the CICD Run CI/CD label Oct 2, 2026

QuncCccccc added the CICD Run CI/CD label Oct 2, 2026

QuncCccccc requested a review from elliette October 2, 2026 22:56

abdullahtas0 added 4 commits October 14, 2026 12:10

Fix MenuAnchor scrollbar safe area padding

7071811

Reuse MenuAnchor MediaQuery data

f84f8d3

Apply suggested wording for the menu scrollbar comment

f304493

QuncCccccc force-pushed the agent/fix-menu-anchor-scrollbar-padding branch from 0f6d17b to f304493 Compare October 14, 2026 19:10

flutter-dashboard Bot removed the CICD Run CI/CD label Oct 14, 2026

QuncCccccc added the CICD Run CI/CD label Oct 14, 2026

elliette approved these changes Oct 22, 2026

View reviewed changes

elliette added the autosubmit Merge PR when tree becomes green via auto submit App label Oct 22, 2026

auto-submit Bot merged commit 95c83e5 into flutter:main Oct 22, 2026
14 checks passed

engine-flutter-autoroll mentioned this pull request Oct 23, 2026

Roll Packages from 93baed9106f6 to 108dad0d562e (23 revisions) flutter/flutter#195161

Merged

Conversation

abdullahtas0 commented Aug 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Pre-Review Checklist

Footnotes

Uh oh!

google-cla Bot commented Aug 13, 2026

Uh oh!

gemini-code-assist Bot left a comment

Choose a reason for hiding this comment

Code Review

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

abdullahtas0 commented Aug 25, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

QuncCccccc left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

elliette left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Uh oh!

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

abdullahtas0 commented Aug 13, 2026 •

edited

Loading

abdullahtas0 commented Aug 25, 2026 •

edited

Loading