flutter supprimer le bouton de retour sur la barre d'applications

Je me demande si quelqu'un connaît un moyen de supprimer le bouton de retour qui apparaît appBardans une application flutter lorsque vous utilisez Navigator.pushNamedpour aller sur une autre page. La raison pour laquelle je ne le souhaite pas sur cette page résultante est qu'il provient de la navigation et que je souhaite que les utilisateurs utilisent le logoutbouton à la place, afin que la session recommence.

Vous pouvez supprimer le bouton de retour en passant un vide new Container()comme leadingargument à votreAppBar .

Cependant, si vous vous trouvez en train de faire cela, vous ne voulez probablement pas que l'utilisateur puisse appuyer sur le bouton de retour de l'appareil pour revenir à l'itinéraire précédent. Au lieu d'appeler pushNamed, essayez d'appelerNavigator.pushReplacementNamed pour faire disparaître l'itinéraire précédent.

Un exemple de code complet pour cette dernière approche est ci-dessous.

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

Je crois que les solutions sont les suivantes

Vous en fait soit:

• Je ne veux pas afficher ce vilain bouton de retour (:]), et donc optez pour AppBar(...,automaticallyImplyLeading: false,...):;

• Je ne veux pas que l'utilisateur revienne en arrière - remplaçant la vue actuelle - et opte donc pour Navigator.pushReplacementNamed(## your routename here ##):;

• Je ne veux pas que l'utilisateur revienne en arrière - en remplaçant une certaine vue dans la pile - et utilise donc: Navigator.pushNamedAndRemoveUntil(## your routename here ##, f(Route<dynamic>)→bool); où f est une fonction retournant truelors de la rencontre avec la dernière vue que vous souhaitez conserver dans la pile (juste avant la nouvelle);

• Je ne veux pas que l'utilisateur revienne - JAMAIS - en vidant complètement la pile du navigateur avec: Navigator.pushNamedAndRemoveUntil(context, ## your routename here ##, (_) => false);

À votre santé

Un moyen simple de supprimer le bouton de retour dans l'AppBar consiste à définir automaticallyImplyLeadingsur false.

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

Je veux juste ajouter une description sur la réponse @Jackpap:

automatiquementImplyLeading:

Cela vérifie si nous voulons appliquer le widget arrière (widget principal) sur la barre d'application ou non. Si la valeur automaticImplyLeading est false, un espace est automatiquement attribué au titre et si si le widget principal est true, ce paramètre n'a aucun effet.

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

// si vous voulez masquer le bouton retour, utilisez le code ci-dessous

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

// si vous voulez masquer le bouton de retour et arrêter l'action pop, utilisez le code ci-dessous

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

Le widget AppBar a une propriété appelée automaticallyImplyLeading. Par défaut, sa valeur est true. Si vous ne voulez pas que le flutter crée automatiquement le bouton de retour pour vous, créez simplement la propriété false.

appBar: AppBar(
  title: Text("YOUR_APPBAR_TITLE"), 
  automaticallyImplyLeading: false,
),

Pour ajouter votre bouton de retour personnalisé

appBar: AppBar(
  title: Text("YOUR_APPBAR_TITLE"), 
  automaticallyImplyLeading: false,
  leading: YOUR_CUSTOM_WIDGET(),
),

Si vous naviguez vers une autre page. Navigator.pushReplacement()peut être utilisé. Il peut être utilisé si vous naviguez de la connexion à l'écran d'accueil. Ou vous pouvez utiliser.
AppBar(automaticallyImplyLeading: false)

Utilisez ceci pour les slivers AppBar

SliverAppBar (
        automaticallyImplyLeading: false,
        elevation: 0,
        brightness: Brightness.light,
        backgroundColor: Colors.white,
        pinned: true,
      ),

Utilisez ceci pour la barre d'applications normale

 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,

),

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

Ça marche bien