翩翩屏的层次结构

Question

在我的应用程序中，我有3个无状态屏幕，屏幕 "A"，屏幕 "B"，屏幕 "C"。

在我的材料应用程序中，我使用屏幕 "A "作为主屏幕。

MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        textTheme: Theme.of(context).textTheme.apply(
              bodyColor: LightColors.kDarkBlue,
              displayColor: LightColors.kDarkBlue,
              fontFamily: 'Poppins'
            ),
      ),
      home: ScreenA(),
      debugShowCheckedModeBanner: false,
    ),

在屏幕 "A "内，我导航到屏幕 "B"，从屏幕 "B "我导航到屏幕 "C"。

在屏幕 "A "内

Navigator.push(
  context,
  MaterialPageRoute(
    builder: (context) => ScreenB(),
  ),
);

内屏 "B"

Navigator.push(
  context,
  MaterialPageRoute(
    builder: (context) => ScreenC(),
  ),
);

但当我检查flutter布局时，我得到的是这样的。

实际

屏风A

• 屏风B

• 屏风

除外

屏风A

• 屏风B

  • 屏风

我是新来的flutter.有谁能帮我解释或实现吗？

谅谅

Answer 1

你可以尝试一种不同的方法。也许使用命名的路由代替。你可以把每个屏幕作为独立的屏幕，然后使用路由来浏览它们。

https:/flutter.devdocscookbooknavigationnamed-routes(命名路线)

这样你就可以在每个单独的页面中注入你想要的东西。

要做到这一点，你必须在创建应用程序时定义路由。

MaterialApp(
 // Start the app with the "/" named route. In this case, the app starts
 // on the FirstScreen widget.
    initialRoute: '/',
    routes: {
 // When navigating to the "/" route, build the FirstScreen widget.
       '/': (context) => FirstScreen(),
 // When navigating to the "/second" route, build the SecondScreen widget.
       '/second': (context) => SecondScreen(),
     },
    );

然后使用Navigator.pushNamed()方法调用每个路由。例如，如果你在一个按钮里面这样做。

//Within the `FirstScreen` widget
    onPressed: () {
//Navigate to the second screen using a named route.
    Navigator.pushNamed(context, '/second');
     }