颤动删除应用栏上的后退按钮答案

【问题标题】：flutter remove back button on appbar颤动删除应用栏上的后退按钮
【发布时间】：2017-12-12 04:35:09
【问题描述】：

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

【问题讨论】：

标签： flutter navigation back-button appbar

【解决方案1】：

我认为解决方案如下

实际上你要么：

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

干杯

【讨论】：

这就是我要找的答案！ pushReplacementNamed() 对我不起作用，但是返回的用户永远是最终起作用的！谢谢！
确实这是最好的答案。
谢谢，我不得不使用“pushReplacementNamed”而不是“popAndPushNamed”

【解决方案2】：

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

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

【讨论】：

虽然这很容易实现，但对于给定的场景，Navigator.pushReplacementNamed 是正确的解决方案。您建议的是一种解决方法，如果应用于所有场景，最终可能会推断出错误的行为，例如某人希望 AppBar 继续暗示领先行为的某个地方（即：后退导航按钮）
虽然移除了后退箭头图标，但您仍然可以通过按设备的后退按钮返回
如果我能再往下读一个答案，我就会得到这个问题的实际答案。谢谢?
仅在 Android 上移除后退按钮的最佳方法是什么，以便 Android 用户必须使用设备的后退按钮才能返回，而 iOS 用户会看到 AppBar 后退按钮？
这应该是公认的答案！

【解决方案3】：

您可以通过将空的new Container() 作为leading 参数传递给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(),
      },
    );
  }
}

【讨论】：

是的，我的命令搞混了。我会试试看，谢谢你的帮助。
@Collin，pushReplacementNamed 似乎并没有消除使用系统返回箭头返回的可能性。
@Collin Jackson，pushReplacementNamed() 是否处理前一个屏幕小部件（以及所有相关数据和状态）？
@Jackpap 那是因为如果有以前的路线，它确实会显示箭头。如果这是唯一的路线，那么就没有什么可回头的了。在您的情况下，请使用空的 Container() 方法。
空容器方法似乎会导致后退按钮所在的空间，因此 Appbar 标题略微移动。仍然不是一个理想的方法。

【解决方案4】：

自动暗示前导：

这将检查我们是否要在应用栏上应用后置小部件（前导小部件）。如果 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!"),
          ),
        ),
      ),
    ),
  );
}

【讨论】：

【解决方案5】：

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

),

【讨论】：

【解决方案6】：

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

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

【讨论】：

【解决方案7】：

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

【讨论】：

【解决方案8】：

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

【讨论】：

【解决方案9】：

SliverAppBar( automaticImplyLeading: false,}

【讨论】：

【解决方案10】：

只是让它透明，按下结束时没有任何动作

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

【讨论】：

【解决方案11】：

只需在 AppBar() 中使用 automaticImplyLeading

appBar: AppBaar(
  automaticallyImplyLeading: false,
)

【讨论】：

【解决方案12】：

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

一切正常

【讨论】：

我们需要提供前导：new Container() 标签