Pedro Ripper
Pedro Ripper

Reputation: 11

Flutter DropdownMenu not recognizing mouse click on DropdownMenuEntry after ChangeNotifierProvider

Recently, I have added a ChangeNotifierProvider on my main.dart to detect changes on localization for my flutter desktop app (Windows).

Since then, I have not been able to click on any DropdownMenuEntry from another view (which does not use ChangeNotifierProvider). After going back and forth between commits, I noticed that this issue disappears if I rollback to my previous main.dart version without ChangeNotifierProvider.

However, it seems that the problem is just with the mouse click, more specifically for this DropdownMenu. I have other buttons on my app and they work perfectly fine with mouse clicks. And my mouse pointer enters in the "focus" state (with the hand pointing).

Also, my DropdownMenu accepts keyboard input. So if I wanted to just type down one of the DropdownMenuEntrys and hit enter, it would work. Because of that, I tried to disable keyboard input but the mouse click remains broken.

Has anyone had a similar problem or knows the solution for that?

Thank you in advance!

I've tried to simplify my code to get to a minimal working example:

Here's my main.dart

import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:provider/provider.dart';
import 'package:hub/app/app.bottomsheets.dart';
import 'package:hub/app/app.dialogs.dart';
import 'package:hub/app/app.locator.dart';
import 'package:hub/app/app.router.dart';
import 'package:hub/services/localization_service.dart';
import 'package:hub/ui/common/app_name.dart';
import 'package:hub/ui/common/app_notifier.dart';
import 'package:hub/ui/common/app_window.dart';
import 'package:hub/ui/common/app_themes.dart';
import 'package:responsive_builder/responsive_builder.dart';
import 'package:stacked_themes/stacked_themes.dart';
import 'package:url_strategy/url_strategy.dart';

Future<void> main(List<String> args) async {
  print(args.toString());

  final appName = getAppName();

  WidgetsFlutterBinding.ensureInitialized();
  await ThemeManager.initialise();
  setPathUrlStrategy();
  await setupLocator(stackedRouter: stackedRouter);
  setupDialogUi();
  setupBottomSheetUi();
  await setupNotifications(appName);

  final lightTheme = await buildLightTheme();
  final darkTheme = await buildDarkTheme();

  runApp(MainApp(
    appName: appName,
    lightTheme: lightTheme,
    darkTheme: darkTheme,
  ));

  setupAppWindow(appName);
}

class MainApp extends StatelessWidget {
  final String appName;
  final ThemeData lightTheme;
  final ThemeData darkTheme;

  const MainApp({
    required this.appName,
    required this.lightTheme,
    required this.darkTheme,
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    return ThemeBuilder(
      defaultThemeMode: ThemeMode.dark,
      lightTheme: lightTheme,
      darkTheme: darkTheme,
      // statusBarColorBuilder: (theme) => theme?.colorScheme.secondary,
      builder: (context, regularTheme, darkTheme, themeMode) => ResponsiveApp(
        preferDesktop: true,
        builder: (context) => ChangeNotifierProvider(
          create: (context) => LocalizationService(),
          child: Consumer<LocalizationService>(
            builder: (context, localization, child) {
              localization.getSavedLocale(appName);
              return MaterialApp.router(
                theme: regularTheme,
                darkTheme: darkTheme,
                themeMode: themeMode,
                debugShowCheckedModeBanner: false,
                localizationsDelegates: AppLocalizations.localizationsDelegates,
                supportedLocales: AppLocalizations.supportedLocales,
                routerDelegate: stackedRouter.delegate(),
                routeInformationParser: stackedRouter.defaultRouteParser(),
                locale: localization.locale,
              );
            },
          ),
        ),
      ),
    );
  }
}

And my view with a DropdownMenu

import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:stacked/stacked.dart';
import 'package:stacked_services/stacked_services.dart';

import 'export_import_collection_dialog_model.dart';

class ExportImportCollectionDialog extends StackedView<ExportImportCollectionDialogModel> {
  final DialogRequest request;
  final Function(DialogResponse) completer;

  const ExportImportCollectionDialog({
    required this.request,
    required this.completer,
    super.key,
  });

  @override
  Widget builder(BuildContext context, ExportImportCollectionDialogModel viewModel, Widget? child) {
    final l10n = AppLocalizations.of(context)!;
    final theme = Theme.of(context);

    final myVector = ["one", "two", "three"];

    return Dialog(
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10)),
      insetPadding: const EdgeInsets.symmetric(horizontal: 10, vertical: 10),
      child: Container(
        width: 500,
        padding: const EdgeInsets.symmetric(vertical: 20),
        child: Column(
          mainAxisSize: MainAxisSize.min,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            ListTile(
              leading: Text(
                l10n.exportAndImport,
                style: const TextStyle(
                  fontSize: 20,
                  fontWeight: FontWeight.w500,
                ),
              ),
              trailing: IconButton(
                onPressed: () => completer(DialogResponse(confirmed: true)),
                icon: const Icon(Icons.close),
              ),
            ),
            const SizedBox(height: 16),
            Column(
              children: [
                DropdownMenu(
                  label: Text(l10n.selectCollection),
                  dropdownMenuEntries: myVector
                      .map(
                        (value) => DropdownMenuEntry(
                          value: value,
                          label: value,
                        ),
                      )
                      .toList(),
                  menuHeight: 200.0,
                  width: 400.0,
                  enableFilter: true,
                  enableSearch: true,
                  onSelected: (value) => {
                    print(value),
                  },
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }

  @override
  ExportImportCollectionDialogModel viewModelBuilder(BuildContext context) => ExportImportCollectionDialogModel();
}

Upvotes: 1

Views: 38

Answers (0)

Related Questions