flutter 如何在我打开时显示子菜单将鼠标悬停在子菜单上?

5sxhfpxr  于 2023-01-31  发布在  Flutter
关注(0)|答案(1)|浏览(208)

在Flutter的新版本中,我尝试将TopBar菜单与鼠标悬停在按钮上时出现的子菜单集成在一起,但我无法让它在鼠标悬停在子菜单上时显示。
你能帮帮我吗?
Flutter3.7.0·通道稳定·https://github.com/flutter/flutter.git框架·修订版b06b8b2710(3天前)·2023年1月23日16:55:55 - 0800引擎·修订版b24591ed32工具·Dart 2.19.0·开发工具2.20.1

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

void main() => runApp(const MenuBarApp());

class MyMenuBar extends StatefulWidget implements PreferredSizeWidget {
  const MyMenuBar({super.key});

  @override
  State<MyMenuBar> createState() => _MyMenuBarState();

  @override
  Size get preferredSize => const Size.fromHeight(kToolbarHeight);
}

class _MyMenuBarState extends State<MyMenuBar> {
  final MenuController _menuController = MenuController();

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
        MenuAnchor(
          controller: _menuController,
          style: const MenuStyle(
              backgroundColor: MaterialStatePropertyAll<Color>(Colors.black),
              padding:
                  MaterialStatePropertyAll<EdgeInsets>(EdgeInsets.all(8))),
          menuChildren: _getMenus(),
          builder: (context, controller, child) {
            return TextButton(
                child: Text("Home"),
                onPressed: () {},
                onHover: (_) {
                  if (controller.isOpen) {
                    Future.delayed(const Duration(milliseconds: 200),
                        () {
                      controller.close();
                    });
                  } else {
                    controller.open();
                  }
                });
          },
        ),
      ],
    );
  }

  List<Widget> _getMenus() {
    return [
      MenuItemButton(
        onHover: (_) {
          _menuController.open();
        },
        child: TextButton(
          onPressed: () {},
          child: const Text(
            "About",
            textAlign: TextAlign.left,
            overflow: TextOverflow.ellipsis,
            style: TextStyle(
                fontSize: 16, fontWeight: FontWeight.w500, color: Colors.white),
          ),
        ),
      )
    ];
  }
}

class MenuBarApp extends StatelessWidget {
  const MenuBarApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: Scaffold(appBar: MyMenuBar()),
    );
  }
}

What I have been able to do now

相关问题