Hi, is there any ways to change the container colour when I switch tab inside a TabBar in flutter? The tabBar did not allow me to put a child inside the tab and return error, hence I wrap a container inside the Tab and used boxDecoration to make the shape. When I switch tab, I need to change the opacity of the container just like the text color. Here is my code:
child: TabBar(
labelColor: Color(0xFF000000),
unselectedLabelColor: Color(0x4F000000),
labelStyle: TextStyle(fontSize: fontSizeXs),
unselectedLabelStyle: TextStyle(fontSize: fontSizeXs),
indicatorColor: Color(0xFFC32127),
tabs: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Tab(
text: '未结算注单',
),
Container(
width: 28,
height: 15,
margin: const EdgeInsets.only(left: 10.0),
decoration: BoxDecoration(
borderRadius: new BorderRadius.all(Radius.elliptical(100, 80)),
color: Color(0xFFc32127),
),
child: Center(
child: Text('0',
style: TextStyle(color: Color(0xFFFFFFFF), fontSize: fontSizeXss),),
),
)
],
),
Add a TabController and then bind to tabController.addListener(yourmethod). The method will be triggered every time the user switches between pages.
tabController.addListener(onIndexChanged);
void onIndexChanged() {
setState(() {
activeTabIndex = tabController.index;
});
}
TabBar(
controller: tabController, ....
User contributions licensed under CC BY-SA 3.0