我想知道,是否有人知道appBar
当您Navigator.pushNamed
移至另一页面时,如何删除显示在Flutter应用中的后退按钮的方法。我不希望在此结果页面上显示它的原因是它来自导航,我希望用户改用logout
按钮,以便会话重新开始。
Answers:
您可以通过将空白new Container()
作为leading
参数传递到来删除“后退”按钮AppBar
。
但是,如果您发现自己这样做了,则可能不希望用户按下设备的“后退”按钮返回到先前的路线。而不是致电pushNamed
,请尝试致电Navigator.pushReplacementNamed
以使以前的路线消失。
下面是后一种方法的完整代码示例。
import 'package:flutter/material.dart';
class LogoutPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text("Logout Page"),
),
body: new Center(
child: new Text('You have been logged out'),
),
);
}
}
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text("Remove Back Button"),
),
floatingActionButton: new FloatingActionButton(
child: new Icon(Icons.fullscreen_exit),
onPressed: () {
Navigator.pushReplacementNamed(context, "/logout");
},
),
);
}
}
void main() {
runApp(new MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'Flutter Demo',
home: new MyHomePage(),
routes: {
"/logout": (_) => new LogoutPage(),
},
);
}
}
pushReplacementNamed()
处置了先前的屏幕小部件(以及所有依赖于数据和状态的信息)?
我相信解决方案如下
您实际上要么:
不想显示该丑陋的后退按钮(:]),因此选择:
AppBar(...,automaticallyImplyLeading: false,...)
;
不希望用户能够回到- 取代当前视图 -从而去:
Navigator.pushReplacementNamed(## your routename here ##)
;
不想让用户返回- 将某个视图替换回堆栈中 -然后使用:
Navigator.pushNamedAndRemoveUntil(## your routename here ##, f(Route<dynamic>)→bool);
其中f是遇到true
您要保留在堆栈中的最后一个视图时返回的函数(紧接在新视图之前);
不想让用户返回-EVER-使用以下方法完全清空导航器堆栈:
Navigator.pushNamedAndRemoveUntil(context, ## your routename here ##, (_) => false);
干杯
删除AppBar中的后退按钮的一种简单方法是将设置automaticallyImplyLeading
为false
。
appBar: AppBar(
title: Text("App Bar without Back Button"),
automaticallyImplyLeading: false,
),
Navigator.pushReplacementNamed
是正确的解决方案。您所建议的解决方法是,如果将其应用于所有情况下,最终可能会推断出错误的行为,例如某人希望某处AppBar
继续暗示领先行为(例如,后退导航按钮)
只想在@Jackpap答案上添加一些描述:
automaticImplyLeading:
这检查我们是否要在应用程序栏上应用后退窗口小部件(前导窗口小部件)。如果automaticImplyLeading为false,则将自动为标题提供空间;如果前导小部件为true,则此参数无效。
void main() {
runApp(
new MaterialApp(
home: new Scaffold(
appBar: AppBar(
automaticallyImplyLeading: false, // Used for removing back buttoon.
title: new Center(
child: new Text("Demo App"),
),
),
body: new Container(
child: new Center(
child: Text("Hello world!"),
),
),
),
),
);
}
//如果要隐藏后退按钮,请使用以下代码
class SecondScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Remove Back Button'),
//hide back button
automaticallyImplyLeading: false,
),
body: Center(
child: Container(),
),
);
}
}
//如果要隐藏后退按钮并停止弹出动作,请使用以下代码
class SecondScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new WillPopScope(
onWillPop: () async => false,
child: Scaffold(
appBar: AppBar(
title: Text("Second Screen"),
//For hide back button
automaticallyImplyLeading: false,
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
RaisedButton(
child: Text('Back'),
onPressed: () {
Navigator.pop(context);
},
),
],
)
),
),
);
}
AppBar小部件具有名为的属性automaticallyImplyLeading
。默认情况下,其值为true
。如果您不希望flutter自动为您构建后退按钮,则只需设置属性即可false
。
appBar: AppBar(
title: Text("YOUR_APPBAR_TITLE"),
automaticallyImplyLeading: false,
),
添加自定义后退按钮
appBar: AppBar(
title: Text("YOUR_APPBAR_TITLE"),
automaticallyImplyLeading: false,
leading: YOUR_CUSTOM_WIDGET(),
),
如果导航到另一个页面。 Navigator.pushReplacement()
可以使用。如果您要从登录导航到主屏幕,则可以使用它。或者您可以使用。
AppBar(automaticallyImplyLeading: false)
将此用于条状AppBar
SliverAppBar (
automaticallyImplyLeading: false,
elevation: 0,
brightness: Brightness.light,
backgroundColor: Colors.white,
pinned: true,
),
将其用于常规Appbar
appBar: AppBar(
title: Text
("You decide on the appbar name"
style: TextStyle(color: Colors.black,),
elevation: 0,
brightness: Brightness.light,
backgroundColor: Colors.white,
automaticallyImplyLeading: false,
),