TabBar:自定义标签栏的样式

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

当前激活状态的标签的样式跟未激活的状态有一点区别 .. 不过不太明显 .. 下面我们再单独设置一下未被选择的标签的颜色 .. 在 TabBar 里面 ... 添加一个 unselectedLabelColor .. 颜色用一种半透明的黑色 ..

现在未被选择的标签的颜色会更浅一些 ..

当前激活状态下的标签的下面会有一条线 .. 这个东西叫 indicator .. 先添加一个 indicatorColor ... 重新设置一下这个指示器的颜色 ... 颜色是黑色 .. 不透明度是 54 ..

然后再添加一个 indicatorSize ... 它的值默认是 TabBarIndicatorSize.tab ... 就是这个指示器的长度是标签的长度 .. 这里我们把它改成 label 的长度 ..

再设置一下 indicator 的 Weight ... 设置成 1.0 ...

TabBar:自定义标签栏的样式《 Flutter 移动应用:界面结构 》

统计

14696
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点