Fix ISSUE: MenuFlyoutSubItem was not displaying when hovered or pressing over in a DropdownButton.

[Abbas1Hussein]

The error occurred because of the inheritance relationship between the MenuFlyoutSubItem class that extends from MenuFlyoutItem.

before ( picture )1:

if (widget.closeAfterClick && item is MenuFlyoutItem);

after ( picture 2):

if (item is MenuFlyoutSubItem) {
 return _buildMenuFlyoutISubItem(item);
}

if (widget.closeAfterClick && item is MenuFlyoutItem) {
 return _buildMenuFlyoutItem(item, context);
}

Checklist

• I have updated CHANGELOG.md with my changes
• I have run "dart format ." on the project

[bdlukaa]

Could you explain the issue better? I don't understand it

[Abbas1Hussein]

Could you explain the issue better? I don't understand it

The Problem:
the MenuFlyoutSubItem is not displaying when hovered or pressed.

return DropDownButton(
  title: const Text('menu'),
  items: [
    MenuFlyoutItem(
      text: const Text('import'),
      onPressed: () {},
    ),
    // MenuFlyoutSubItem items will not display when hovered or pressed.
    MenuFlyoutSubItem(
      text: const Text('open with...'),
      items: (context) {
        return [
          MenuFlyoutItem(text: const Text('powerpoint'), onPressed: () {}),
          MenuFlyoutItem(text: const Text('excel'), onPressed: () {}),
          MenuFlyoutItem(text: const Text('word'), onPressed: () {}),
        ];
      },
    ),
    MenuFlyoutItem(text: const Text('export'), onPressed: () {}),
  ],
);

Upon further reflection, I've identified an issue with the initial solution proposed in the pull request.

and best solution it removing the closeAfterClick parmater,
and closeing MenuFlyoutItem automatically after a click.

Revised Solution:

• Remove closeAfterClick and automatically close MenuFlyoutItem after a click.

I acknowledge that the initial solution might not have been entirely accurate, and I believe this revised approach provides a more effective resolution.

I'm open to any feedback you may have and am willing to make further adjustments if necessary.

[bdlukaa]

I like the first solution better. I'd like to keep the closeAfterClick property, since this is the case on the native side.

[Abbas1Hussein]

I like the first solution better. I'd like to keep the closeAfterClick property, since this is the case on the native side.

the issue is related to the fact that only the first MenuFlyoutSubItem is displayed as expected, but subsequent ones are not showing correctly when hovered or pressed.

return DropDownButton(
  title: const Text('menu'),
  items: [
    MenuFlyoutItem(
      text: const Text('import'),
      onPressed: () {},
    ),
    // MenuFlyoutSubItem items will display when hovered or pressed.
    MenuFlyoutSubItem(
      text: const Text('open with...'),
      items: (context) {
        return [
          MenuFlyoutItem(text: const Text('powerpoint'), onPressed: () {}),
          MenuFlyoutItem(text: const Text('excel'), onPressed: () {}),
          MenuFlyoutItem(text: const Text('word'), onPressed: () {}),
        ];
      },
    ),
    // Additional MenuFlyoutSubItem items will not display when hovered or pressed.
    MenuFlyoutSubItem(
      text: const Text('open with 2 ...'),
      items: (context) {
        return [
          MenuFlyoutItem(text: const Text('powerpoint 2'), onPressed: () {}),
          MenuFlyoutItem(text: const Text('excel 2'), onPressed: () {}),
          MenuFlyoutItem(text: const Text('word 2'), onPressed: () {}),
        ];
      },
    ),
    MenuFlyoutItem(text: const Text('export'), onPressed: () {}),
  ],
);

I will make another attempt to resolve the issue while retaining the closeAfterClick property.

[Abbas1Hussein]

Hello there, I've resolved all the issues, and now it works as expected.

[bdlukaa]

Hello, the tests are not passing and you should rebase your branch.

[Abbas1Hussein]

Hello, the tests are not passing and you should rebase your branch.

• dart format lib/src/controls/inputs/dropdown_button.dart
  Formatted 1 file (0 changed) in 0.40 seconds.

• dart analyze
  Analyzing fluent_ui... No issues found!