Playing with Flutter AppBar

Mir Mahfuz
1 min readOct 10, 2018

--

Simple AppBar with Center Title…..

AppBar (                                                  backgroundColor: Colors.blue, 
title: new Text("Title"),
elevation: 4.0,
centerTitle: true,
),

Simple ApBar with IconTheme and TextTheme…..

AppBar(
backgroundColor: Colors.blueAccent,
title: new Text("Title"),
actions: <Widget>[
new IconButton(icon: new Icon(Icons.search),
onPressed: (){},
),
],
iconTheme: IconThemeData(
color: Colors.white,
),
textTheme: TextTheme(
title: TextStyle(
color: Colors.white,
fontSize: 20.0,
)
),
),

AppBar with List Of Action Button…..

AppBar(
backgroundColor: Colors.blueAccent,
title: new Text("Title"),
actions: <Widget>[
new IconButton(icon: new Icon(Icons.search),
onPressed: (){},
),
new IconButton(icon: new Icon(Icons.menu),
onPressed: (){},
),
],
),

AppBar with Title and Sub Title at Center……

AppBar(
automaticallyImplyLeading: false,
backgroundColor: Colors.blueAccent,
title: Center(
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new Text(
"Title",
style: TextStyle(fontSize: 20.0),
),
new Text(
"SubTile",
style: TextStyle(fontSize: 14.0),
)
],
),
),
),

Check out soure file ….

https://github.com/mirmahfuz99/flutter_dairy_book/blob/master/lib/app_bar/appbar_widget.dart

--

--