Skip to content

Conversation

@jasonkang14
Copy link
Contributor

@jasonkang14 jasonkang14 commented Jul 14, 2024

Changes:

  • Introduced alignmentOffset property to DropdownMenu to allow adjustment of menu alignment.
  • Updated the MenuAnchor widget to utilize the new alignmentOffset property.
  • Default value for alignmentOffset is Offset.zero, meaning no additional spacing by default.

Motivation:

The motivation behind this change is to provide developers with more control over the spacing between the MenuAnchor and dropdownMenuEntries in the DropdownMenu widget. This enhancement allows for better alignment and customization of the dropdown menu appearance.

before after
Screenshot 2024-07-14 at 8 03 14 PM Screenshot 2024-07-14 at 8 03 27 PM

Initially, it was suggested to use a SizedBox to introduce spacing. However, upon further examination of the source code, it was discovered that the DropdownMenuEntries are rendered on the screen via an OverlayPortal. This necessitated leveraging the existing alignmentOffset property within the MenuAnchor for a more seamless and effective alignment adjustment.

Pre-launch Checklist

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

@flutter-dashboard
Copy link

It looks like this pull request may not have tests. Please make sure to add tests before merging. If you need an exemption to this rule, contact "@test-exemption-reviewer" in the #hackers channel in Chat (don't just cc them here, they won't see it! Use Discord!).

If you are not sure if you need tests, consider this rule of thumb: the purpose of a test is to make sure someone doesn't accidentally revert the fix. Ask yourself, is there anything in your PR that you feel it is important we not accidentally revert back to how it was before your fix?

Reviewers: Read the Tree Hygiene page and make sure this patch meets those guidelines before LGTMing.

@google-cla
Copy link

google-cla bot commented Jul 14, 2024

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.

@github-actions github-actions bot added framework flutter/packages/flutter repository. See also f: labels. f: material design flutter/packages/flutter/material repository. labels Jul 14, 2024
@jasonkang14
Copy link
Contributor Author

jasonkang14 commented Jul 14, 2024

it looks like a test which is not a part of this PR is failing

@nate-thegrate nate-thegrate self-requested a review July 14, 2024 16:57
Copy link
Contributor

@nate-thegrate nate-thegrate left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Phenomenal work here, leveraging an existing MenuAnchor parameter to fit the desired use case 👍

I have a couple of suggestions related to writing comments, but everything about the implementation looks fantastic!

@nate-thegrate
Copy link
Contributor

nate-thegrate commented Jul 14, 2024

In order to merge, we'll need 1 more approval, and all tests need to pass.

Since the test failure involves a MenuAnchor, it's likely related to these changes I just saw the same test failure on a different branch, so it looks like this is just a coincidence!

@jasonkang14
Copy link
Contributor Author

I've implemented all the suggestions. Thank you. If the test code error originates elsewhere, is this PR ready for approval? The tests pass in my local environment, so if I need to make more changes, please guide me on how to reproduce the failed cases so I can make the necessary adjustments!

@nate-thegrate
Copy link
Contributor

is this PR ready for approval?

Yes! Assuming all the checks pass, the only thing we need is a second reviewer. Some folks on the Flutter team are out on vacation, but I bet we'll be able to get approval number 2 sometime this week.

@jasonkang14
Copy link
Contributor Author

I think the test was failing because I got rid of the default alignmentOffset but did not update the test case accordingly. I just changed the test case as you suggested!

@jasonkang14
Copy link
Contributor Author

While the exact error message from the log was not visible, running dart --enable-asserts analyze.dart locally revealed detailed error information. The following changes were made to resolve the issue:

1. Updated Dependencies:

  • Added flutter SDK dependency in dev/snippets/pubspec.yaml.
  • Ensured compatibility by updating the versions of various dependencies as shown below:
dependencies:
  flutter:
    sdk: flutter
  analyzer: 6.4.1
  args: 2.4.2
  dart_style: 2.3.6
  file: 7.0.0
  meta: 1.12.0
  path: 1.9.0
  platform: 3.1.4
  process: 5.0.2

2. Refactored StockStrings Classes:

  • Modified constructors to use the super keyword for better readability and maintainability.

Before:

// dev/benchmarks/test_apps/stocks/lib/i18n/stock_strings_en.dart

class StockStringsEn extends StockStrings {
  StockStringsEn([String locale = 'en']) : super(locale);
}

After:

// dev/benchmarks/test_apps/stocks/lib/i18n/stock_strings_en.dart

class StockStringsEn extends StockStrings {
  StockStringsEn([super.locale = 'en']);
}
  • Applied similar changes to StockStringsEs:

Before:

// dev/benchmarks/test_apps/stocks/lib/i18n/stock_strings_es.dart

class StockStringsEs extends StockStrings {
  StockStringsEs([String locale = 'es']) : super(locale);
}

After:

// dev/benchmarks/test_apps/stocks/lib/i18n/stock_strings_es.dart

class StockStringsEs extends StockStrings {
  StockStringsEs([super.locale = 'es']);
}
  • Refactored the StockStrings abstract class for consistency and clarity:

Before:

// dev/benchmarks/test_apps/stocks/lib/i18n/stock_strings.dart

abstract class StockStrings {
  StockStrings(String locale) : localeName = intl.Intl.canonicalizedLocale(locale.toString());
}

After:

// dev/benchmarks/test_apps/stocks/lib/i18n/stock_strings.dart

abstract class StockStrings {
  StockStrings(String locale) : localeName = intl.Intl.canonicalizedLocale(locale);
}

These modifications resolve the error, but I'm uncertain if they align with Flutter's design principles. I'd appreciate your review to determine if these changes are appropriate. If so, should we consider them for a separate pull request?

Copy link
Contributor

@nate-thegrate nate-thegrate left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Dang, sorry you had to go through all that!

In the future, you can see the full log by going to the overview page, and then scrolling down & clicking on either "stdout" or "[raw]":

image

Looks like the problem can be fixed with a const constructor.

@jasonkang14
Copy link
Contributor Author

@nate-thegrate finally passed all the tests. thank you!

expect(textField.keyboardType, TextInputType.text);
});

testWidgets('DropdownMenu with an alignmentOffset does not throw errors', (WidgetTester tester) async {
Copy link
Contributor

@navaronbracke navaronbracke Jul 15, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I do not think that this test is testing the right thing? The MenuAnchor widget accepts a nullable alignmentOffset. So it would not "crash" if you gave it an alignment offset.

Instead, grab the MenuAnchor from the subtree and compare the alignmentOffset in an expect:

await tester.pumpWidget(...);

final MenuAnchor menuAnchor = tester.widget<MenuAnchor>(find.byType(MenuAnchor));

expect(menuAnchor.alignmentOffset, alignmentOffset);

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

To expand on this a bit: This PR adds the alignmentOffset parameter to DropdownMenu, when previously it could only be configured for MenuAnchor. So if the changes to dropdown_menu.dart were reverted, attempting to set an offset this way would throw an exception.

With that in mind, I think the new version of this test is much better than what I'd suggested beforehand 👍

@jasonkang14 jasonkang14 force-pushed the dropdown-menu-alignent-offset branch from 44ffc71 to d63978a Compare July 15, 2024 08:25
@jasonkang14
Copy link
Contributor Author

jasonkang14 commented Jul 15, 2024

I have implemented the suggested changes to the test case provided by @navaronbracke, and I have rebased this branch on the latest master as well

- Introduced `alignmentOffset` property to `DropdownMenu` to allow adjustment of menu alignment.
- Updated the `MenuAnchor` widget to utilize the new `alignmentOffset` property.
- Default value for `alignmentOffset` is `Offset.zero`, meaning no additional spacing by default.
@jasonkang14 jasonkang14 force-pushed the dropdown-menu-alignent-offset branch from d63978a to 733ca70 Compare July 17, 2024 01:59
@jasonkang14
Copy link
Contributor Author

I have rebased this branch on the latest master because tree-status check was failing but now there is an issue with Google testing. and the log just says "Please contact a Google developer to investigate." do you guys have any suggestions for me to pass this test?

@nate-thegrate
Copy link
Contributor

If the tree-status is failing, it just means that there are testing issues on the main branch. It usually switches back and forth a few times each day; if it's failing, we can add the autosubmit label, and a bot will automatically merge the PR once it's back to green.

Google testing failures could be a number of different things. Unfortunately, not everyone with commit access can see the test output, so we'll need to wait for a Googler to take a look.

@jasonkang14
Copy link
Contributor Author

@nate-thegrate appreciate the prompt response! thank you :)

@Piinks Piinks requested a review from QuncCccccc July 18, 2024 22:16
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.

LGTM! Thanks for the contribution:)

@QuncCccccc QuncCccccc added the autosubmit Merge PR when tree becomes green via auto submit App label Jul 24, 2024
@auto-submit auto-submit bot merged commit 6fdcb0a into flutter:master Jul 24, 2024
@jasonkang14 jasonkang14 deleted the dropdown-menu-alignent-offset branch July 25, 2024 06:57
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jul 25, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jul 25, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jul 25, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jul 25, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jul 25, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jul 26, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jul 26, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jul 26, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jul 26, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jul 27, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jul 27, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jul 28, 2024
engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Jul 28, 2024
auto-submit bot pushed a commit to flutter/packages that referenced this pull request Jul 29, 2024
Roll Flutter from 7d5c1c0 to 031dc3d (97 revisions)

flutter/flutter@7d5c1c0...031dc3d

2024-07-26 [email protected] Roll Flutter Engine from 342a42547822 to 354abf2800a0 (7 revisions) (flutter/flutter#152385)
2024-07-26 [email protected] Use more CORS headers for flutter run server (flutter/flutter#152249)
2024-07-26 [email protected] Manual roll Flutter Engine from 8714b54a87c0 to 342a42547822 (6 revisions) (flutter/flutter#152379)
2024-07-26 [email protected] feat: Add drag handle size to be configurable based on given size (flutter/flutter#152085)
2024-07-26 [email protected] Add and use an integration test with native(ADB) screenshots (flutter/flutter#152326)
2024-07-26 [email protected] Roll Packages from 19daf6f to 3d358d9 (4 revisions) (flutter/flutter#152372)
2024-07-26 [email protected] Add test for range_slider.0.dart (flutter/flutter#152152)
2024-07-26 [email protected] Introduce `TabBar.indicatorAnimation` to customize tab indicator animation (flutter/flutter#151746)
2024-07-26 [email protected] Roll Flutter Engine from 21629ece8b72 to 8714b54a87c0 (3 revisions) (flutter/flutter#152351)
2024-07-26 [email protected] Cleanup examples/api web load logic to latest (flutter/flutter#152349)
2024-07-26 [email protected] Adds a call to the `PlatformDispatcher` whenever the focus changes (flutter/flutter#151268)
2024-07-26 [email protected] Roll Flutter Engine from d665bf82dc32 to 21629ece8b72 (4 revisions) (flutter/flutter#152344)
2024-07-25 [email protected] `docImport`s for the widgets library (flutter/flutter#152339)
2024-07-25 [email protected] Set dart defines properly while in debug mode. (flutter/flutter#152262)
2024-07-25 49699333+dependabot[bot]@users.noreply.github.com Bump github/codeql-action from 3.25.13 to 3.25.14 (flutter/flutter#152342)
2024-07-25 [email protected] Roll Flutter Engine from 74785a771ae6 to d665bf82dc32 (2 revisions) (flutter/flutter#152340)
2024-07-25 [email protected] Cleanup InputDecoration.collapsed constructor (flutter/flutter#152165)
2024-07-25 [email protected] Add test for expansion_panel_list.expansion_panel_list_radio.0_test.dart (flutter/flutter#151730)
2024-07-25 [email protected] Roll Flutter Engine from f862a620cee4 to 74785a771ae6 (2 revisions) (flutter/flutter#152333)
2024-07-25 [email protected] Roll Packages from 1c319ac to 19daf6f (3 revisions) (flutter/flutter#152327)
2024-07-25 [email protected] Add a more typical / concrete example to IntrinsicHeight / IntrinsicWidth (flutter/flutter#152246)
2024-07-25 [email protected] Roll Flutter Engine from f47b4d8e145a to f862a620cee4 (1 revision) (flutter/flutter#152320)
2024-07-25 [email protected] Roll Flutter Engine from 74737820a8ee to f47b4d8e145a (7 revisions) (flutter/flutter#152314)
2024-07-25 [email protected] Flutter Web App: adds a11y semantic attributes to slider (flutter/flutter#151985)
2024-07-25 [email protected] Manual roll Flutter Engine from eb8fac2b1703 to 74737820a8ee (8 revisions) (flutter/flutter#152305)
2024-07-25 98614782+auto-submit[bot]@users.noreply.github.com Reverts "Roll Flutter Engine from eb8fac2b1703 to a57655cccb55 (6 revisions) (#152293)" (flutter/flutter#152304)
2024-07-25 [email protected] Roll Flutter Engine from eb8fac2b1703 to a57655cccb55 (6 revisions) (flutter/flutter#152293)
2024-07-25 [email protected] Modify stepping integration test to accommodate new DDC async semantics. (flutter/flutter#152204)
2024-07-25 98614782+auto-submit[bot]@users.noreply.github.com Reverts "Roll Flutter Engine from eb8fac2b1703 to e1259b86ba02 (2 revisions) (#152285)" (flutter/flutter#152289)
2024-07-25 [email protected] Update fake_codec.dart to use Future.value instead of SynchronousFuture (flutter/flutter#152182)
2024-07-25 [email protected] Roll Flutter Engine from eb8fac2b1703 to e1259b86ba02 (2 revisions) (flutter/flutter#152285)
2024-07-25 [email protected] Roll Flutter Engine from 4b952093cb99 to eb8fac2b1703 (3 revisions) (flutter/flutter#152278)
2024-07-24 [email protected] [CupertinoAlertDialog] Rewrite (flutter/flutter#150410)
2024-07-24 [email protected] Revert "Make `CupertinoRadio`'s `mouseCursor` a `WidgetStateProperty`" (flutter/flutter#152254)
2024-07-24 [email protected] Fix: A selectable's selection under the active selection should not be cleared on right-click (flutter/flutter#151851)
2024-07-24 [email protected] Marks Mac channels_integration_test to be flaky (flutter/flutter#151882)
2024-07-24 [email protected] Roll Flutter Engine from c2f489d783d6 to 4b952093cb99 (3 revisions) (flutter/flutter#152264)
2024-07-24 [email protected] added Semantics label to TextField with InputDecoration to let user kâ�¦ (flutter/flutter#151996)
2024-07-24 [email protected] feat: Add alignmentOffset to DropdownMenu (flutter/flutter#151731)
2024-07-24 [email protected] Roll Flutter Engine from 490576daf810 to c2f489d783d6 (6 revisions) (flutter/flutter#152260)
2024-07-24 [email protected] Scaffolding for `NativeDriver` and `AndroidNativeDriver` for taking screenshots using `adb`. (flutter/flutter#152194)
2024-07-24 [email protected] `widgets` docImport (flutter/flutter#152146)
2024-07-24 [email protected] Roll Flutter Engine from 3078f6a90e71 to 490576daf810 (1 revision) (flutter/flutter#152239)
2024-07-24 98614782+auto-submit[bot]@users.noreply.github.com Reverts "Use more CORS headers for `flutter run` server (#152048)" (flutter/flutter#152248)
2024-07-24 [email protected] Use more CORS headers for `flutter run` server (flutter/flutter#152048)
2024-07-24 98614782+auto-submit[bot]@users.noreply.github.com Reverts "Enable Swift Package Manager by default on master channel (#152049)" (flutter/flutter#152243)
...
TytaniumDev pushed a commit to TytaniumDev/flutter that referenced this pull request Aug 7, 2024
Changes:
- Introduced `alignmentOffset` property to `DropdownMenu` to allow adjustment of menu alignment.
- Updated the `MenuAnchor` widget to utilize the new `alignmentOffset` property.
- Default value for `alignmentOffset` is `Offset.zero`, meaning no additional spacing by default.

Motivation: 
- This PR closes flutter#151524 
- @nate-thegrate, please let me know if I need to make changes in order for this PR to be merged

The motivation behind this change is to provide developers with more control over the spacing between the `MenuAnchor` and `dropdownMenuEntries` in the `DropdownMenu` widget. This enhancement allows for better alignment and customization of the dropdown menu appearance.
| before | after |
| :---: | :---: |
| <img width="372" alt="Screenshot 2024-07-14 at 8 03 14�PM" src="https://github.com/user-attachments/assets/4a45b843-7fa4-44fd-843c-c7209c6f57ae">      |      <img width="364" alt="Screenshot 2024-07-14 at 8 03 27�PM" src="https://github.com/user-attachments/assets/12e8b857-aefb-4aaf-a310-4a002abcbc2f">   |

Initially, it was suggested to use a `SizedBox` to introduce spacing. However, upon further examination of the source code, it was discovered that the `DropdownMenuEntries` are rendered on the screen via an `OverlayPortal`. This necessitated leveraging the existing `alignmentOffset` property within the `MenuAnchor` for a more seamless and effective alignment adjustment.
Buchimi pushed a commit to Buchimi/flutter that referenced this pull request Sep 2, 2024
Changes:
- Introduced `alignmentOffset` property to `DropdownMenu` to allow adjustment of menu alignment.
- Updated the `MenuAnchor` widget to utilize the new `alignmentOffset` property.
- Default value for `alignmentOffset` is `Offset.zero`, meaning no additional spacing by default.

Motivation: 
- This PR closes flutter#151524 
- @nate-thegrate, please let me know if I need to make changes in order for this PR to be merged

The motivation behind this change is to provide developers with more control over the spacing between the `MenuAnchor` and `dropdownMenuEntries` in the `DropdownMenu` widget. This enhancement allows for better alignment and customization of the dropdown menu appearance.
| before | after |
| :---: | :---: |
| <img width="372" alt="Screenshot 2024-07-14 at 8 03 14�PM" src="https://github.com/user-attachments/assets/4a45b843-7fa4-44fd-843c-c7209c6f57ae">      |      <img width="364" alt="Screenshot 2024-07-14 at 8 03 27�PM" src="https://github.com/user-attachments/assets/12e8b857-aefb-4aaf-a310-4a002abcbc2f">   |

Initially, it was suggested to use a `SizedBox` to introduce spacing. However, upon further examination of the source code, it was discovered that the `DropdownMenuEntries` are rendered on the screen via an `OverlayPortal`. This necessitated leveraging the existing `alignmentOffset` property within the `MenuAnchor` for a more seamless and effective alignment adjustment.
@SergeyShustikov
Copy link

SergeyShustikov commented Oct 25, 2024

Hi, how soon it will be in stable version?

@nate-thegrate
Copy link
Contributor

Hi, how soon it will be in stable version?

This fix is available in the current beta channel and will be included in the next stable release (scheduled for mid-November).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

autosubmit Merge PR when tree becomes green via auto submit App 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.

Add spacing between MenuAnchor and dropdownMenuEntries in DropdownMenu

5 participants