I'm trying to implement my own TabBar design in flutter. I was able to get a pretty good result. However, when I tap another tab to change the tab, there is a highlight create by default as shown in the image here. I'm wondering if there is any way I can get rid of the square highlight on tapped. I've been looking around for like almost a day not and did not find any solution.
If anyone have any solution please let me know. Thanks.
Edited: as CopsOnRoad suggestion I wrapped the TabBar in the Container and set the color to Colors.transparent
, but it does not really disappear so I tried to set the color to Theme.of(context).canvasColor
for now.
Container(
color: Theme.of(context).canvasColor,
child: TabBar(
isScrollable: true,
indicator: ShapeDecoration(
color: Color(0xFFE6E6E6),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(99.0)
)
),
tabs: List<Widget>.generate(
categories.length,
(index) => Tab(
child: Text(
categories[index],
style: TextStyle(
fontFamily: 'Hiragino Sans',
fontWeight: FontWeight.bold,
fontSize: 18.0,
color: Color(0xFF4D4D4D),
),
),
)
),
)
)
That's the ripple effect. You can remove it by wrapping it in a Container
and giving transparent color to it.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With