How to customize tabbar width in flutter?
TabBar(isScrollable: true)
Makes a scrollable tab bar. it's useful when your tab text content or number of your tabs doesn't fit into display size.
or maybe you can do something like this:
child: new TabBar( tabs: [ new Container( width: 30.0, child: new Tab(text: 'hello'), ), new Container( child: new Tab(text: 'world'), ), ], )
here's how I solved this problem:
bottom: TabBar( isScrollable: true, controller: _tabController, indicatorColor: Colors.white, labelPadding: EdgeInsets.symmetric(horizontal: 10.0), tabs: <Widget>[ Tab( icon: Icon(Icons.camera_alt), ), Tab( text: "CONVERSAS", ), Tab( text: "STATUS", ), Tab( text: "CHAMADAS", ) ], )
Just use padding, I think it'll work for every screen size!... and don't forget:
isScrollable: true
double width = MediaQuery.of(context).size.width; double yourWidth = width / 5;bottom: TabBar( indicatorColor: Colors.white, indicatorSize: TabBarIndicatorSize.label, isScrollable: true, controller: _tabcontroller, tabs: <Widget>[ Container( width: 30, height: 50, alignment: Alignment.center, child: Icon( Icons.camera_alt, ), ), Container( width: yourWidth, height: 50, alignment: Alignment.center, child: Text("CHATS")), Container( width: yourWidth, height: 50, alignment: Alignment.center, child: Text("STATUS")), Container( width: yourWidth, height: 50, alignment: Alignment.center, child: Text("CALL")) ], ),`---------------`