Drawer in Tab bar also showing in sliver app bar

Question

I'm trying to learn new widgets of flutter and am stuck in using sliver bar. I am using Tab bar and a drawer layout on the tab bar and at one tab i am trying to implement sliver app bar but sliver app bar is copying the same drawer layout which i have in tab bar. How to fix this?

This is tab bar implementation

@override Widget build(BuildContext context) { // TODO: implement build return MaterialApp( home: DefaultTabController(length: 3, child: Scaffold( appBar: AppBar( title: Text("App Bar"), bottom: TabBar( tabs: [ Tab(icon: Icon(Icons.account_circle)), Tab(icon: Icon(Icons.ac_unit)), Tab(icon: Icon(Icons.print)) ])), drawer: Drawer( child: Column( children: <Widget> [ ListTile( leading: Icon(Icons.ac_unit), title: Text("AC UNIT"), onTap: () { Navigator.pop(context); }, ), ListTile( leading: Icon(Icons.message), title: Text("Message"), ), ListTile( leading: Icon(Icons.print), title: Text("PRINT"), ) ], ),), body: TabBarView(children:<Widget> [ Icon(Icons.directions_bike), new SecondWidget(title: "Second widget"), new ThirdWidget() ]))));

and this is third widget implementation

class ThirdWidget extends StatefulWidget { @override _ThirdWidgetState createState() => _ThirdWidgetState();} class _ThirdWidgetState extends State<ThirdWidget> { @override Widget build(BuildContext context) { return CustomScrollView( slivers: <Widget> [ SliverAppBar( pinned: false, expandedHeight: 150, flexibleSpace: FlexibleSpaceBar(title: Text("Epic Sliver")) )],);}}

You should use either appbar or sliverappbar, SliverAppBar is 'advanced' AppBar. Take a look at this api.flutter.dev/flutter/material/AppBar-class.html — svarog
– svarog, Commented Jan 10, 2020 at 8:38

Zoul Barizi · Accepted Answer · 2020-02-10 11:54:53Z

3

add automaticallyImplyLeading: false in your SliverAppBar()

answered Feb 10, 2020 at 11:54

Zoul Barizi

5404 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Yann39 · Accepted Answer · 2020-01-11 18:08:29Z

One solution is to wrap the SliverAppBar with an additional Scaffold which has no Appbar, so that no icon appears in the SliverAppBar.

Example :

Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text("Hello from app bar"), ), drawer: YourDrawer(), body: Scaffold( body: NestedScrollView( headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) { return <Widget>[ SliverAppBar( ... ), ], }, body: Text("Hello from body"), ), ), ); }

Collectives™ on Stack Overflow

Drawer in Tab bar also showing in sliver app bar

This is tab bar implementation

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

This is tab bar implementation

2 Answers 2

Comments

Comments

Related