【问题标题】:Flutter.io Navigator errors in appbar [duplicate]appbar中的Flutter.io Navigator错误[重复]
【发布时间】:2018-09-03 22:54:54
【问题描述】:

我决定尝试一下flutter,偶然发现了以下问题:

在我的应用程序中,我希望在 AppBar 中有一个按钮,可以将用户带到另一个屏幕。但是,每当我尝试在任何 IconButtons 的 onPressed 处理程序中调用 Navigator 时,都会收到以下错误:

使用不包含导航器的上下文请求导航器操作。 用于从导航器推送或弹出路由的上下文必须是小部件的上下文,该小部件是 Navigator 小部件的后代。

这是我的 ma​​in.dart(减去导入):

void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var service = new ProjectService();

    return new MaterialApp(
        theme: new ThemeData(
          primaryColor: Colors.deepOrange,
        ),
        home: new Scaffold(
          appBar: new AppBar(
              title: new Text("My App Title"),
              actions: 
              <Widget>[
                new IconButton(
                    icon: new Icon(Icons.add),
                    onPressed: () =>
                        Navigator.of(context).pushNamed("/projects/add")) //<-- Here's where I get the exception
              ],
              elevation: 0.0),
          body: new Center(child: new ProjectList(projects: service.toList())), //<-- Exactly the same code runs fine here
          drawer: new AppDrawer(),
        ),
        routes: <String, WidgetBuilder>{
          '/projects/add': (BuildContext context) => new ProjectAddScreen(),
          '/projects/test': (BuildContext context) => new ProjectAddScreen(),
          '/settings': (BuildContext context) => new AppSettingsScreen(),
          '/about': (BuildContext context) => new AboutScreen()
        });
  }
}

这是构建应用实例的唯一地方,AppBar 是标准的AppBar,与flutter/material 包捆绑在一起。

我的flutter doctor 输出(如果有任何相关性)

[√] Flutter (Channel master, v0.2.5-pre.41, on Microsoft Windows [Version 10.0.16299.309], locale en-US)
[!] Android toolchain - develop for Android devices (Android SDK 26.0.2)
    X Android license status unknown. // I use the SDK manager from Visual Studio
[!] Android Studio (version 3.0)
    X Unable to determine bundled Java version. //I use the SDK manager from Visual Studio so I have no need in Android Studio
[√] VS Code, 64-bit edition (version 1.21.1)
[√] Connected devices (1 available)

【问题讨论】:

  • @rémi-rousselet,感谢您指出这一点。从概念上讲,我的问题确实似乎是该线程的副本,但是那里发布的代码有所不同。此外,我所见过的关于颤振的官方指南都没有显示通过Builder 实例化ScaffoldAppBar,所以我没有给予足够的关注。

标签: dart flutter


【解决方案1】:

尽管 Rémi 在他对这个问题的评论中指出(对不起,我不知道如何正确提及他的用户),但事实证明这是 this thread 的重复。但是因为我发现那里提供的代码有点脱离上下文,我认为值得一提的是我如何在我的特定用例中应用那里提供的解决方案。

我做了一些调试,发现当我在IconButtononPressed 处理程序中时,上下文不是IconButtonAppBar 的上下文。这是MaterialApp 的。如果你问我,这既合乎逻辑又很奇怪,特别是如果你考虑到将相同的代码放在 body 的中心是有效的。

不过,我还是打开了 Stocks 示例应用程序,看看他们是如何构建应用程序的,并简单地遵循了他们在那里使用的模式。

这是我最终得到的结果:

ma​​in.dart

void main() => runApp(new MyApp());

class MyApp extends StatefulWidget {

  @override
  MyAppState createState() {
    return new MyAppState();
  }

}

class MyAppStateextends State<MyApp> {

  ProjectService _projectService;

  @override
  void initState() {
    super.initState();
    _projectService = new ProjectService();
  }

  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
       title: "My App",
        theme: new ThemeData.light(),
        routes: <String, WidgetBuilder> {
          '/projects/add': (BuildContext context) => new HomeScreen(_projectService),
          '/': (BuildContext context) => new HomeScreen(_projectService)
        }
    );
  }
}

HomeScreen.dart

class HomeScreen extends StatefulWidget {
  final ProjectService projectService;

  const HomeScreen(this.projectService);

  @override
  HomeScreenState createState() => new HomeScreenState();
}

class HomeScreenState extends State<HomeScreen> {
  void handleProjectUpdate() {
    setState(() => {});
  }

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      body: new ListView(
        children: widget.projectService.all().map<ListTile>((f) {
          return new ListTile(
            title: new Text(f.name),
          );
        }).toList(),
      ),
      appBar: new AppBar(
        actions: <Widget>[
          new IconButton(
              icon: new Icon(Icons.add),
              onPressed: () => Navigator.pushNamed(context, "/projects/add"))
        ],
      ),
    );
  }
}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2023-02-05
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-10-17
    • 2019-05-12
    • 2019-10-25
    相关资源
    最近更新 更多