dart 不同屏幕导航上的Flutter常数应用栏

0mkxixxg  于 2023-04-03  发布在  Flutter
关注(0)|答案(2)|浏览(156)

我正在开发一个应用程序在Flutter与几个屏幕我想添加AppBar在主屏幕上,并希望该应用程序栏被固定在所有屏幕上,但在虚拟代码,我已经写了整个屏幕被取代。
下面是屏幕HomeScreen -这里我已经创建了appbar

当我点击AddPolicy按钮,我得到的屏幕,现在我只是有一个文本,但整个屏幕被替换如下,但我想标题appBar应该是固定的.我如何才能实现这一点.
下面是代码主页-https://github.com/lodha13/samkit/blob/main/lib/screens/home.dart
AddPolicy页面-https://github.com/lodha13/samkit/blob/main/lib/screens/add_policy.dart

yhived7q

yhived7q1#

你有两个选择:
1.拥有appbar的全局小部件,并在每个不同的页面上使用它,或者
1.您可以在main.dart中有一个Scaffold,而不是为每个页面生成一个新的body,只需使用setState更改body参数。例如:

// have as many widget as you want for each page
const body1 = Text("body1"); //just a simple example, you can change it to whatever you want. 
const body2 = Text("body2");
return Scaffold(
      appBar: AppBar(
        title: const Text('Sample Code'),
      ),
      body: handleBody(selectedIndex)
    );

然后你可以有一个函数来处理body:

handleBody(int index){ // you can pass different input for body selection I have used an int for simplicity

if(index == 1){return body1;}
if(index ==2) {return body2;}
// and so on
}

现在通过改变selectedIndex你可以显示不同的身体。个人来说,我更喜欢有一个widgetslist,并选择其中一个基于selectedIndex

niwlg2el

niwlg2el2#

我强烈推荐通过Flutter的这个教程:https://codelabs.developers.google.com/codelabs/flutter-codelab-first#7
它基本上解决了你的问题。在教程中,他们保持了相同的NavigationRail。在NavigationRail中,他们设置了更改页面的选定索引。

Widget build(BuildContext context) {
    Widget page;
    switch (selectedIndex) {
      case 0:
        page = GeneratorPage();
        break;
      case 1:
        page = FavoritesPage();
        break;
      default:
        throw UnimplementedError('no widget for $selectedIndex');
    }
}

相关问题