Am having trouble regarding margin-left and top on the Apppbar, am using the leading
icon, but I failed to reposition it.
Below is my code :
child: Scaffold(
appBar: PreferredSize(
preferredSize: Size.fromHeight(150.0),
child: AppBar(
leading: SizedBox(
width: 200,
height: 200,
child: Transform.scale(scale: 2,
child: IconButton(
icon: Image.asset('assets/app_logo.png')
,
),
)
),
centerTitle: true,
actions: <Widget>[
IconButton(
icon: Image.asset('assets/path.png'))
],
bottom: TabBar(
labelColor: Colors.white,
indicatorColor: Colors.lime,
tabs:[
Tab(icon: null,text: 'RECENT',),
Tab(icon: null, text: 'TOPICS',),
Tab(icon: null, text: 'AUTHORS',),
]
),
)
This is where my styling for the leading
icon is :
leading: SizedBox(
width: 200,
height: 200,
child: Transform.scale(scale: 2,
child: IconButton(
icon: Image.asset('assets/app_logo.png')
,
)
This is screen shot :
I don't think you can easily change the size of the leading widget regarding the layout of the AppBar
But you can use a Stack
widget to put your logo over the AppBar like this :
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: PreferredSize(
preferredSize: Size.fromHeight(150.0),
child: Stack(
children: <Widget>[
AppBar(
bottom: TabBar(
controller: _tabController,
labelColor: Colors.white,
indicatorColor: Colors.lime,
tabs: [
Tab(
icon: null,
text: 'RECENT',
),
Tab(
icon: null,
text: 'TOPICS',
),
Tab(
icon: null,
text: 'AUTHORS',
),
],
),
),
Container(
padding: EdgeInsets.only(left: 20, top: 60),
child: Container(
width: 50,
height: 50,
color: Colors.yellow,
child: Center(child: Text('Logo')),
),
),
],
),
),
),
);
}