bdlukaa / fluent_ui

Implements Microsoft's WinUI3 in Flutter.
https://bdlukaa.github.io/fluent_ui/
BSD 3-Clause "New" or "Revised" License
2.98k stars 465 forks source link

🐛 Problem with the menu of DropDownButton #1116

Closed hsa-online closed 1 month ago

hsa-online commented 2 months ago

DropDownButton widget (and its menu) do not work properly in my app:

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        Container(
          decoration: const BoxDecoration(
            border: Border(bottom: BorderSide(color: Colors.black)),
          ),
          child: Row(
            children: [
              BlocBuilder<BlocActive, StateActive>(
                builder: (context, state) {
                  return fl.Tooltip(
                    message: "Create",
                    child: fl.DropDownButton(
                      title: const Icon(Icons.add, size: 20.0),
                      items: [
                        fl.MenuFlyoutItem(
                          text: const Text('Test1...'),
                          onPressed: !isEnabledTest1(context) ? null : () {
                            onActionTest1(context);
                          }
                        ),
                        fl.MenuFlyoutItem(
                          text: const Text('Test2...'),
                          onPressed: null
                        ),
                      ],
                    )
                  );
                }
              ),
              ...

On clicking Test1 menu item the onActionTest1 handler is called but the drop-down menu remains open. Also Test2 menu item is enabled despite of its onPressed is null.

Clicking to Test2 menu item throws an error:

        throw FlutterError(
          'A ${notifier.runtimeType} was used after being disposed.\n'
          'Once you have called dispose() on a ${notifier.runtimeType}, it '
          'can no longer be used.',

An app has nothing special, only as it uses the BLoC, widgets are added as children of BlocBuilder. Application build() looks like this:

  Widget build(BuildContext context) {
    return MultiBlocProvider(
      providers: [
        ...
      ],
      child: MultiBlocListener(
        listeners: [
          ...
        ], 
        child: 
          const FluentApp(
            title: 'App',
            home: Scaffold(
              body: MainWindow(title: 'App'),
            ),
          ),

Library version: fluent_ui: ^4.9.1

hsa-online commented 2 months ago

I also tried to modify "fluent_ui" example like this:

            DropDownButton(
              title: Text('Email'),
              items: [
                MenuFlyoutItem(text: const Text('Send'), onPressed: () {}),
                MenuFlyoutSeparator(),
                MenuFlyoutItem(text: const Text('Reply'), onPressed: null),
                MenuFlyoutItem(text: const Text('Reply all'), onPressed: () {}),
              ],
            ),

And here is the result:

DropDown

Item "Reply" is expected to be disabled, but it is enabled.

System: Windows 11 Pro

Flutter 3.24.1 • channel stable • https://github.com/flutter/flutter.git Framework • revision 5874a72aa4 (3 weeks ago) • 2024-08-20 16:46:00 -0500 Engine • revision c9b9d5780d Tools • Dart 3.5.1 • DevTools 2.37.2

bdlukaa commented 1 month ago

Sorry, but I can not reproduce your main issue. What happens if you attach a GlobalKey to it?

hsa-online commented 1 month ago

This fix solves the problem in fluent_ui example. And it seems in my code with Bloc there is also another problem not connected to fluent_ui. Thank you!