How to change background color of TabBar without changing the AppBar in flutter?

Create a simple Widget for this, cannot be simpler:

class ColoredTabBar extends Container implements PreferredSizeWidget {  ColoredTabBar(this.color, this.tabBar);  final Color color;  final TabBar tabBar;  @override  Size get preferredSize => tabBar.preferredSize;  @override  Widget build(BuildContext context) => Container(    color: color,    child: tabBar,  );}

You can change the color of the TabBar by changing the Theme primaryColor like that:

return MaterialApp(      theme: ThemeData(        brightness: Brightness.light,        primaryColor: Colors.pink[800], //Changing this will change the color of the TabBar        accentColor: Colors.cyan[600],      ),      home: DefaultTabController(        length: 3,        child: Scaffold(          appBar: AppBar(            bottom: TabBar(              indicatorColor: Colors.lime,              tabs: [                Tab(icon: Icon(Icons.directions_car)),                Tab(icon: Icon(Icons.directions_transit)),                Tab(icon: Icon(Icons.directions_bike)),              ],            ),            title: Text('Tabs Demo'),          ),          body: TabBarView(            children: [              Icon(Icons.directions_car),              Icon(Icons.directions_transit),              Icon(Icons.directions_bike),            ],          ),        ),      ),    );

If you are not using it in an AppBar you could wrap the TabBar in a Material widget and set the color attribute, like that:

class TabBarDemo extends StatelessWidget {  @override  Widget build(BuildContext context) {    return MaterialApp(      home: Scaffold(        appBar: AppBar(          title: Text('Tabs Demo'),        ),        body: DefaultTabController(          length: 3,          child: Column(            children: <Widget>[              Container(                constraints: BoxConstraints(maxHeight: 150.0),                child: Material(                  color: Colors.indigo,                  child: TabBar(                    tabs: [                      Tab(icon: Icon(Icons.directions_car)),                      Tab(icon: Icon(Icons.directions_transit)),                      Tab(icon: Icon(Icons.directions_bike)),                    ],                  ),                ),              ),              Expanded(                child: TabBarView(                  children: [                    Icon(Icons.directions_car),                    Icon(Icons.directions_transit),                    Icon(Icons.directions_bike),                  ],                ),              ),            ],          ),        ),      ),    );  }}

Change Background Color of TabBar in Flutter..

Simply use TabBar in Body of Scaffold, wrap it with Column Widget so that, you can use both without any issue. Wrap TabBar with Container widget to change the tab color.In this way you can change the color of Tab bar in FLutter.

Here's the sample Code...

   Scaffold(       appBar: AppBar(       backgroundColor: const Color(0xFF3baee7),       title: Text("Jobs"),        ),      body: Column(      // Column         children: <Widget>[          Container(            color: Colors.deepOrangeAccent,        // Tab Bar color change             child: TabBar(           // TabBar             controller: tabController,             unselectedLabelColor: Colors.lightBlue[100],             labelColor: const Color(0xFF3baee7),             indicatorWeight: 2,             indicatorColor: Colors.blue[100],             tabs: <Widget>[                              Tab(                 text: "All Jobs",               ),               Tab(                 text: "Most Recent",               ),               Tab(                 text: "Saved Jobs",               )             ],           ),         ),         Expanded(             flex: 3,             child: TabBarView(         // Tab Bar View             physics: BouncingScrollPhysics(),             controller: tabController,             children: <Widget>[AllJobScreen(), AllJobScreen(), AllJobScreen()],               ),            ),         ],    ),  );