MaterialApp构建器错误:找不到“覆盖”小部件

时间:2020-04-07 18:44:00

标签: flutter dart flutter-layout

我在构建NavigationDrawer时遇到错误,其中tootlip小部件需要materialApp作为祖先。

这是错误的意思:

I/flutter ( 5780): _TooltipState#bc79e(ticker inactive)):
I/flutter ( 5780): No Overlay widget found.
I/flutter ( 5780): Tooltip widgets require an Overlay widget ancestor for correct operation.
I/flutter ( 5780): The most common way to add an Overlay to an application is to include a MaterialApp or Navigator
I/flutter ( 5780): widget in the runApp() call.
I/flutter ( 5780): The specific widget that failed to find an overlay was:
I/flutter ( 5780):   Tooltip
I/flutter ( 5780): 
I/flutter ( 5780): The relevant error-causing widget was:
I/flutter ( 5780):   AppBar

我的 main.dart 代码

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      ... //basic info title & theme

      builder: (context, child) => LayoutTemplate(child: child),
      initialRoute:"/home",

      ... //Routing stuff like generate route & navigator key 
    );
  }
}

LayoutTemplate窗口小部件

class LayoutTemplate extends StatelessWidget {
  final Widget child;

  const LayoutTemplate({Key key, this.child}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text("home"))
        drawer: NavDrawer()
        body: Column(
          children: <Widget>[
            //NavigationBar(),
            Expanded(
              child: child,
            )
          ],
       ),
    );
  }
}

抱歉,添加了太多代码。我不确定是什么原因引起的。可能是builder中的MaterialApp引起的。

感谢您的帮助。

5 个答案:

答案 0 :(得分:1)

在您的构建器中,只需返回一个将 LayoutTemplate 作为 OverlayEntry 的 Overlay 小部件。

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      ... //basic info title & theme

      builder: (context, child) {
        return Overlay(
          initialEntries: [
            OverlayEntry(
              builder: (context) => LayoutTemplate(child: child),
            ),
          ],
        );
      },
      initialRoute:"/home",

      ... //Routing stuff like generate route & navigator key 
    );
  }
}

答案 1 :(得分:0)

有同样的问题。

leading Material的{​​{1}}属性的文档解释了如何自己实现,我刚刚删除了tooltip属性,它开始起作用,请参见:https://api.flutter.dev/flutter/material/AppBar/leading.html

AppBar

希望有帮助。

答案 2 :(得分:0)

我通过使用home而不是builder参数来解决此问题

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      ... //basic info title & theme

      home: LayoutTemplate(child: child),
      initialRoute:"/home",

      ... //Routing stuff like generate route & navigator key 
    );
  }
}

答案 3 :(得分:0)

相反,在您的每条路线中使用您的 LayoutTemplate 小部件:

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      // ... basic info title & theme

      initialRoute:"/home",
      routes: [
        '/home': (context) => LayoutTemplate(child: Text('Home')),
        // etc, for other routes
      ],
    );
  }
}

builder 参数最适合用于“在 Navigator 上方插入 [heritable 小部件] 或 - 当使用 WidgetsApp.router 构造函数时 - 在 Router 上方但低于WidgetsApp 小部件创建的其他小部件,或用于完全替换 Navigator/Router。” (WidgetsApp.builder 文档)

<块引用>

比如,从传递给这个方法的BuildContext中,DirectionalityLocalizationsDefaultTextStyleMediaQuery等都是可用的。它们也可以通过影响导航器或路由器中所有路由的方式被覆盖。

WidgetsApp.builder 文档)

答案 4 :(得分:0)

如果你正在使用responsive_framework: ^0.1.4 包并且你遇到了这个问题,这里是修复

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter App',
      home: MyHomePage(),
      builder: (context, child) {
        return Overlay(
          initialEntries: [
            OverlayEntry(
              builder: (context) {
                return ResponsiveWrapper.builder(
                  MyHomePage(),
                  defaultScale: true,
                  breakpoints: [
                    ResponsiveBreakpoint.autoScale(1000),
                  ],
                );
              },
            ),
          ],
        );
      },
    );
  }
}