抖动删除应用栏上的后退按钮

Question

我想知道，当您使用 Navigator.pushNamed 转到另一个页面时，是否有人知道在 flutter 应用程序中删除显示在 appBar 上的后退按钮的方法。我不希望它出现在这个结果页面上的原因是它来自导航，我希望用户改为使用 logout 按钮，以便会话重新开始。

Answer 1

您可以通过传递一个空 new Container() 作为 leading argument to your AppBar 来移除后退按钮。

如果您发现自己这样做，您可能不希望用户能够按设备的后退按钮返回到先前的路线。不要调用 pushNamed，而是尝试调用 Navigator.pushReplacementNamed 以使较早的路由消失。

函数pushReplacementNamed会移除backstack中之前的路由并用新路由替换。

后者的完整代码示例如下。

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(),
      },
    );
  }
}

Answer 2

删除 AppBar 中的后退按钮的一种简单方法是将 automaticallyImplyLeading 设置为 false。

appBar: AppBar(
  title: Text("App Bar without Back Button"),
  automaticallyImplyLeading: false,
),

Answer 3

我认为解决方案如下

你实际上是：

不想显示那个丑陋的后退按钮 (:])，因此选择： 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);

干杯

Answer 4

  appBar: new AppBar(title: new Text("SmartDocs SPAY"),backgroundColor: Colors.blueAccent, automaticallyImplyLeading:false,
        leading: new Container(),
      ),

工作正常

Answer 5

自动隐含前导：

这会检查我们是否要在应用栏上应用后退小部件（前导小部件）。如果 automaticallyImplyLeading 为 false，则自动将 space 赋予标题，如果 leading widget 为 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!"),
          ),
        ),
      ),
    ),
  );
}

Answer 6

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(),
),

Answer 7

// 如果你想隐藏后退按钮使用下面的代码

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);
              },
            ),
          ],
        )
    ),
  ),
);
 }

Answer 8

如果导航到另一个页面。 Navigator.pushReplacement()可以使用。如果您从登录导航到主屏幕，则可以使用它。或者你可以使用 .
AppBar(automaticallyImplyLeading: false)

Answer 9

将此用于 slivers 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,

),

Answer 10

直接设为透明，按下结束时无动作

AppBar(
            leading: IconButton(
              icon: Icon(
                Icons.arrow_back,
                color: Colors.white.withOpacity(0),
              ),
              onPressed: () {},
            ),

Answer 11

SliverAppBar( automaticallyImplyLeading: false,}

Answer 12

只需在 AppBar() 中使用 automaticallyImplyLeading

appBar: AppBaar(
  automaticallyImplyLeading: false,
)

抖动删除应用栏上的后退按钮

flutter remove back button on appbar

navigation

appbar

back-button

flutter