Moh*_*ali 11 mobile-application flutter flutter-navigation
我是 flutter 的新手,我正在开发一个具有多个屏幕的应用程序。
我想知道如何阻止 Flutter 创建同一路线的多个屏幕,例如我有Page 1和Page 2,如果我单击按钮导航到 Page 2 并再次单击同一个按钮,应用程序将推送一个第 2 页的新屏幕,我将拥有两次,如果我单击返回按钮,它会将我送回第一个创建的第 2 页
有没有办法只创建每个页面一次然后重新打开它,如果它已经被推送到堆栈中?
我正在使用Navigator.push所有导航
在这里使用一个简单的逻辑
如果新页面与当前页面相同,则使用Navigator.push(context,route).
如果新页面不同,则使用Navigator.pushReplacement(context,route).
如果您使用的是命名路由,则为
Navigator.pushNamed(context,name).Navigator.pushReplacementNamed(context,name).完整的代码示例
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: SO(),
);
}
}
class SO extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: PageOne(),
);
}
}
class PageOne extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Page 1'),
),
backgroundColor: Colors.amber,
body: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
RaisedButton(
onPressed: () {
print('creating replacement page 1');
Navigator.pushReplacement(context, MaterialPageRoute(builder: (BuildContext context) {
return PageOne();
}));
},
child: Text('Go to page 1'),
),
RaisedButton(
onPressed: () {
print('creating new page 2');
Navigator.push(context, MaterialPageRoute(builder: (BuildContext context) {
return PageTwo();
}));
},
child: Text('Go to page 2'),
),
],
),
),
);
}
}
class PageTwo extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Page 2'),
),
backgroundColor: Colors.brown,
body: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
RaisedButton(
onPressed: () {
print('creating new page 1');
Navigator.push(context, MaterialPageRoute(builder: (BuildContext context) => PageOne()));
},
child: Text('Go to page 1'),
),
RaisedButton(
onPressed: () {
print('creating replacement page 2');
Navigator.pushReplacement(context, MaterialPageRoute(builder: (BuildContext context) => PageTwo()));
},
child: Text('Go to page 2'),
),
],
),
),
);
}
}
Run Code Online (Sandbox Code Playgroud)
小智 5
这些答案都不正确。PushReplacement仍将创建小部件的新实例。确定您是否有可滚动列表RouteA并在导航到RouteB. 当您 时pushReplacement(RouteA),您会看到滚动位置已更改为其初始状态。那是因为实例化了一个新的小部件,这不是您想要的行为。
您应该使用popUntil,如 JoaoSoares 先前回答的那样
你应该使用Navigator.pushReplacement(). 以下是文档:https ://api.flutter.dev/flutter/widgets/NavigatorState/pushReplacement.html
总之,当您调用 时pushReplacement,它会推送一个新页面,但也会处理前一个页面。现在,当您按后退按钮时,它应该会带您返回到第 1 页。
| 归档时间: |
|
| 查看次数: |
10664 次 |
| 最近记录: |