Flutter TabBar 剪切答案

【问题标题】：Flutter TabBar cutFlutter TabBar 剪切
【发布时间】：2021-03-28 11:05:39
【问题描述】：

我对 Flutter 完全陌生，我正在尝试使用这个应用程序 https://github.com/iamabhishek229313/tinder_clone 来更好地理解该语言。

代码看起来很干净，至少容易理解。

但我仍然有一个问题，标签栏正在剪切图标，我不知道为什么（也不知道如何解决它）：

我还没有编辑代码，如果我的理解很好，错误似乎在那个文件中：https://github.com/iamabhishek229313/tinder_clone/blob/master/lib/HomePage.dart

非常感谢！

编辑：我刚刚在 AppBar 组件上找到了 toolbarHeight 属性，但它似乎是一个固定值，我觉得这不会解决所有设备的问题。

【问题讨论】：

标签： flutter user-interface dart tabs

【解决方案1】：

你不应该在title中使用tab bar，而应该在appBar的bottom参数中使用tabBar，这就是它应该在的地方你可以像这样修改你的代码，它会起作用。

 DefaultTabController(
  length: 3,
  child: Scaffold(
    appBar: AppBar(
      bottom: TabBar(
        tabs: [
          Tab(icon: Icon(Icons.directions_car)),
          Tab(icon: Icon(Icons.directions_transit)),
          Tab(icon: Icon(Icons.directions_bike)),
        ],
      ),
    ),
  ),
);

【讨论】：