在这里,我想问或者我可以做一个像“调焦中心”这样的教程,但是左右两个标签是30%透明的,像这样,谢谢!
最佳答案
同样可以使用-unselectedLabelColor:
&indicatorColor:
ofTabBar
widget实现。
示例代码:
@override
Widget build(BuildContext context) {
return DefaultTabController(
length: 6,
child: Scaffold(
appBar: AppBar(
centerTitle: true,
leading: Icon(Icons.person_outline),
title: Text('DASHBOARD',style: TextStyle(fontSize: 16.0),),
bottom: PreferredSize(
child: TabBar(
isScrollable: true,
unselectedLabelColor: Colors.white.withOpacity(0.3),
indicatorColor: Colors.white,
tabs: [
Tab(
child: Text('Tab 1'),
),
Tab(
child: Text('Investment'),
),
Tab(
child: Text('Your Earning'),
),
Tab(
child: Text('Current Balance'),
),
Tab(
child: Text('Tab 5'),
),
Tab(
child: Text('Tab 6'),
)
]),
preferredSize: Size.fromHeight(30.0)),
actions: <Widget>[
Padding(
padding: const EdgeInsets.only(right: 16.0),
child: Icon(Icons.add_alert),
),
],
),
body: TabBarView(
children: <Widget>[
Container(
child: Center(
child: Text('Tab 1'),
),
),
Container(
child: Center(
child: Text('Tab 2'),
),
),
Container(
child: Center(
child: Text('Tab 3'),
),
),
Container(
child: Center(
child: Text('Tab 4'),
),
),
Container(
child: Center(
child: Text('Tab 5'),
),
),
Container(
child: Center(
child: Text('Tab 6'),
),
),
],
)),
);
}
输出: