How to disable highlight and splash behavior of TabBar item in Flutter

Question

I just want disable or change highlightColor and splashColor behavior when tapping on tab item?

My code segment,

SliverAppBar(
    backgroundColor: MyColors.darkGreen,
    elevation: 0.0,
    automaticallyImplyLeading: false,
    bottom: TabBar(
      isScrollable: true,
      unselectedLabelColor: Colors.grey,
      labelColor: Colors.white,
      onTap: (int itemIndex) {},
      indicatorSize: TabBarIndicatorSize.tab,
      indicator: BubbleTabIndicator(
        indicatorHeight: 25.0,
        indicatorColor: Colors.white38,
        tabBarIndicatorSize: TabBarIndicatorSize.tab,
      ),
      tabs: tabs,
      controller: _tabController,
    ),
    pinned: true,
    floating: false,
    title: _titleWidget,
),

Guide me how to make it.

Answer 1

just put your AppBar inside Theme with transparent highlightColor and splashColor.
eg.

return Scaffold(
  appBar: PreferredSize(
    preferredSize: Size.fromHeight(70),
      child: Theme(
        data: ThemeData(
        highlightColor: Colors.transparent,
        splashColor: Colors.transparent,
      ),
      child: AppBar( ... )

Answer 2

Add this in your ThemeData inside MaterialApp.

return MaterialApp(
      theme: ThemeData(
        highlightColor: Colors.transparent,
        splashColor: Colors.transparent,
      ),
      onGenerateRoute: _routes,
      initialRoute: '/',
    );

If you only want to disable the splashColor / highlightColor on that specific TabBar, you can wrap your widget in a Theme widget. That will override the global ThemeData

Answer 3

You can only wrap the TabBar inside Theme() and set the splashColor

Theme(
  data: ThemeData().copyWith(
    splashColor: Colors.transparent),
  child: TabBar(
    ...)
)

Answer 4

follow the process

inside MaterialApp follow this

return MaterialApp(
  theme: ThemeData(
        highlightColor: Colors.transparent,
        splashColor: Colors.transparent,
      ),
);

and inside TabBar follow this property

TabBar(
 overlayColor:MaterialStateProperty.all<Color>(Colors.transparent),
 // above property will remove splash color or it will provider whatever color you want
 tabs:<Widget>[
   Tab(),
 ],
),

hope this will help you!! thank you.