Cómo centrar el título de una barra de aplicaciones

Estoy tratando de centrar el texto del título en una barra de aplicaciones que tiene acciones iniciales y finales.

@override
Widget build(BuildContext context) {
  final menuButton = new PopupMenuButton<int>(
    onSelected: (int i) {},
    itemBuilder: (BuildContext ctx) {},
    child: new Icon(
      Icons.dashboard,
    ),
  );

  return new Scaffold(
    appBar: new AppBar(
      // Here we take the value from the MyHomePage object that
      // was created by the App.build method, and use it to set
      // our appbar title.
      title: new Text(widget.title, textAlign: TextAlign.center),
      leading: new IconButton(
          icon: new Icon(Icons.accessibility),
          onPressed: () {},
      ),
      actions: [
        menuButton,
      ],
    ),
    body: new Center(
      child: new Text(
        'Button tapped $_counter time${ _counter == 1 ? '' : 's' }.',
      ),
    ),
    floatingActionButton: new FloatingActionButton(
      onPressed: _incrementCounter,
      tooltip: 'Increment',
      child: new Icon(Icons.add),
    ), // This trailing comma makes auto-formatting nicer for build methods.
  );
}

Esto funciona bien, excepto que el título está alineado a la izquierda como se muestra en esta imagen:

Cuando trato de incluir el título en el centro, parece que está demasiado a la izquierda:

@override
Widget build(BuildContext context) {
  final menuButton = new PopupMenuButton<int>(
    onSelected: (int i) {},
    itemBuilder: (BuildContext ctx) {},
    child: new Icon(
      Icons.dashboard,
    ),
  );

  return new Scaffold(
    appBar: new AppBar(
      // Here we take the value from the MyHomePage object that
      // was created by the App.build method, and use it to set
      // our appbar title.
      title: new Center(child: new Text(widget.title, textAlign: TextAlign.center)),
      leading: new IconButton(
          icon: new Icon(Icons.accessibility),
          onPressed: () {},
      ),
      actions: [
        menuButton,
      ],
    ),
    body: new Center(
      child: new Text(
        'Button tapped $_counter time${ _counter == 1 ? '' : 's' }.',
      ),
    ),
    floatingActionButton: new FloatingActionButton(
      onPressed: _incrementCounter,
      tooltip: 'Increment',
      child: new Icon(Icons.add),
    ), // This trailing comma makes auto-formatting nicer for build methods.
  );
}

Me encantaría una solución para centrar el texto del título perfectamente entre los 2 iconos.

Centrar el título es lo predeterminado en iOS. En Android, el AppBartítulo de por defecto está alineado a la izquierda, pero puedes anularlo pasando centerTitle: truecomo argumento al AppBarconstructor.

Ejemplo:

AppBar(
  centerTitle: true, // this is all you need
  ...
)

Tuve el mismo problema y finalmente funcionó cuando agregué
mainAxisSize: MainAxisSize.min a mi widget Row. ¡Espero que esto ayude!

 return new Scaffold(
      appBar: new AppBar(
        // Here we take the value from the MyHomePage object that
        // was created by the App.build method, and use it to set
        // our appbar title.
        title: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            Text(
              widget.title,
            ),
          ],
        ),

        leading: new IconButton(
          icon: new Icon(Icons.accessibility),
          onPressed: () {},
        ),
        actions: [
          menuButton,
        ],
      ),
    );
  }

En mi caso, quería tener un logo / imagen centrado en lugar de un texto. En este caso, centerTitleno es suficiente (no estoy seguro de por qué, tengo un archivo svg, tal vez esa sea la razón ...), por ejemplo, esto:

appBar: AppBar(centerTitle: true, title: AppImages.logoSvg)

no centrará realmente la imagen (además, la imagen puede ser demasiado grande, etc.). Lo que me funciona bien es un código como este:

appBar: AppBar(centerTitle: true,
    title: ConstrainedBox(
        constraints: BoxConstraints(maxHeight: 35, maxWidth: 200),
        child: AppImages.logoSvg)),

Así es como hago centerTitle en mi barra de aplicaciones:

@override
Widget build(BuildContext context) {
return Scaffold(
  appBar: new AppBar(
    centerTitle: true ,
    title: new Text("Login"),
  ),
  body: new Container(
    padding: EdgeInsets.all(18.0),
      key: formkey,
        child: ListView(
        children: buildInputs() + buildSubmitButton(),
      ),
   ) 
);
}

Después de probar muchas soluciones, esto me ayudó a centerTitle: true agregar un código de muestra además de la respuesta de @Collin Jackson

Ejemplo enbuild(BuildContext context)

hacer esto

appBar: AppBar(
        // Here we take the value from the MyHomePage object that was created by
        // the App.build method, and use it to set our appbar title.
        title: Text(widget.title),centerTitle: true
      ),

Aquí hay un enfoque diferente si desea crear un título de barra de aplicación personalizado. Por ejemplo, desea una imagen y un texto en el centro de la barra de la aplicación y luego agregue

appBar: AppBar(
          title: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Icon(
                Icons.your_app_icon,
                color: Colors.green[500],
              ),
              Container(
                  padding: const EdgeInsets.all(8.0), child: Text('YourAppTitle'))
            ],

          ),
  )

Aquí hemos creado un Rowcon MainAxisAlignment.centerpara centrar a los niños. Luego, hemos agregado dos hijos: un icono y otro Containercon texto. Envolví el Textwidget en el Containerpara agregar el relleno necesario.

@override
Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
            title: Text('Title'),
            actions: <Widget> [
               IconButton(icon: const Icon(Icons.file_upload), onPressed: _pressed),
            ],
            leading: IconButton(icon: const Icon(Icons.list), onPressed: _pressed),
            centerTitle: true,
        )
        body: Text("Content"),
    );
}

Esto puede ayudar a crear el texto del título de la barra de aplicaciones en el centro. Puede elegir agregar los estilos que desee usando Estilo o comentarlo si no es necesario.

appBar: AppBar(
          title:  const Center(
            child: Text(
              "App Title",
              style: TextStyle( color: Colors.white,fontSize: 20),
            ),
          ),
        ),

En la pantalla de la aplicación:

Puede centrar el título de una barra de aplicaciones mediante el parámetro centerTitle .

centerTitle es un tipo de datos booleano y el valor predeterminado es Falso.

centerTitle : verdadero

Ejemplo:

import 'package:flutter/material.dart';

void main() {
  runApp(
    MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('App Title'),
          backgroundColor: Colors.red,
          centerTitle: true,
        ),
      ),
    ),
  );
}

appbar: AppBar (centerTitle: true, title: Text ("HOLA"))

Usar Centerobjeto

    appBar: AppBar(
      title: Center(
        child: const Text('Title Centered')
      )
    )

appBar: AppBar(
    mainAxisAlignment: MainAxisAlignment.center,
)