How to implement app bar action text instead of action icon in Flutter?

user3831831 picture user3831831 · Jul 5, 2018 · Viewed 7.1k times · Source

I am trying to implement appbar in flutter application. I am able to add an action icon which closes the app. I am willing to show username beside the close action icon. I tried to add new Text() in the action widget array in appar section. but not able to align it. Is there any way to add action text directly?

enter image description here

Code:

@override
  Widget build(BuildContext context) {
    //build a form widget using the form key we created above
    return new Scaffold(
      appBar: new AppBar(
        title: new Text(StringRef.appName),
        actions: <Widget>[

          new Container(),

        new Text(
        userName,
        textScaleFactor: 1.5,
        style: new TextStyle(
          fontSize: 12.0,
          color: Colors.white,
        ),
      ),

      new IconButton(
        icon: new Icon(Icons.close),
        tooltip: 'Closes application',
        onPressed: () => exit(0),
      ),
        ],
      ),
}

Answer

Dhiraj Sharma picture Dhiraj Sharma · Jul 5, 2018

Wrap your Text widget inside Center widget as

new Center(
    new Text(
        userName,
        textScaleFactor: 1.5,
        style: new TextStyle(
          fontSize: 12.0,
          color: Colors.white,
        ),
   ),
)