Comment modifier la couleur du bouton de retour de la barre d'application ?

Question

Je n'arrive pas à trouver comment changer la couleur du bouton de retour automatique de l'appBar. C'est sous un échafaudage et j'ai essayé de faire des recherches mais je n'arrive pas à m'y retrouver.

return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.white,
        title: Image.asset(
          'images/.jpg',
          fit: BoxFit.fill,
        ),
        centerTitle: true,
      ),

Answer 1

Vous devez utiliser le iconTheme de l'AppBar, comme ceci :

  appBar: AppBar(
          iconTheme: IconThemeData(
            color: Colors.black, //change your color here
          ),
          title: Text("Sample"),
          centerTitle: true,
        ),
        body: Text("Sample body"),
      );

Ou si vous voulez gérer le bouton retour par vous-même.

      appBar: AppBar(
               leading: new IconButton(
               icon: new Icon(Icons.arrow_back, color: Colors.black),
               onPressed: () => Navigator.of(context).pop(),
              ), 
              title: Text("Sample"),
              centerTitle: true,
            ),
            body: Text("Sample body"),

Answer 2

Vous pouvez également remplacer la flèche de retour par défaut par un widget de votre choix, via "leading" :

leading: new IconButton(
  icon: new Icon(Icons.arrow_back, color: Colors.orange),
  onPressed: () => Navigator.of(context).pop(),
), 

Le widget AppBar ne fait que fournir un widget "principal" par défaut s'il n'est pas défini.

Answer 3

Il semblait plus facile de créer un nouveau bouton et d'y ajouter de la couleur, voici comment j'ai procédé pour ceux qui se posent la question.

Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: BackButton(
            color: Colors.black
        ),

Answer 4

  appBar: AppBar(
          iconTheme: IconThemeData(
            color: Colors.white, //modify arrow color from here..
          ),
      );