是否可以在 Flutter 中更改 CupertinoTabBar 的高度？答案

【问题标题】：Is it possible to change the CupertinoTabBar height in Flutter?是否可以在 Flutter 中更改 CupertinoTabBar 的高度？
【发布时间】：2023-03-15 15:42:01
【问题描述】：

我想更改CupertinoTabBar 的preferredSize 属性。我意识到这个属性是只读的，所以我尝试：

在 PreferredSize 小部件中包含 CupertinoTabBar，但我收到错误消息，因为 CupertinoTabScaffold 期望 CupertinoTabBar 作为 tabbar，然后我尝试...
创建一个自定义标签栏，扩展CupertinoTabBar，但后来我意识到我无法弄清楚如何覆盖_kTabBarHeight

class CustomCupertinoTabBar extends CupertinoTabBar {
  static const double _kTabBarHeight = 72.0;

  CustomCupertinoTabBar()
      : super(
            // my properties here
      )

  @override
    Size get preferredSize => const Size.fromHeight(_kTabBarHeight);

  // more code here
}

有没有办法修改这个小部件的高度？

【问题讨论】：

标签： ios flutter dart

【解决方案1】：

如果我们进入 CupertinoTabBar 实现，我们可以看到定义该组件高度的属性是一个常量，_kTabBarHeight，它遵循 iOS 设计路线。如果您想要一个自定义导航栏，您可能必须找到另一个适合您需要的小部件。你想在 TabBar 中呈现什么？

例如，如果你在 Scaffold 中使用 BottomNavigationBar，你可以修改它的 iconSize 属性，高度适应这个参数。

BottomNavigationBar(
  currentIndex: _selectedIndex,
  iconSize: 30,
  showUnselectedLabels: true, ...

【讨论】：

BottomNavigationBar 是我的第一个方法，在设计方面我得到了我想要的，在图标和文本上加了一些填充。我只想在图标和文本周围留一些空间。但是我正在构建的整体应用程序结构更适合使用CupertinoTabScaffold，它需要CupertinoTabBar。我想如果我不能覆盖那个 _kTabBarHeight 我会这样。

【解决方案2】：

首先创建一个 CustomTabBar.dart。
在您必须将所有代码从 CupertinoTabBar 复制到 CustomTabBar.dart 之后。然后您只需更改班级中_kTabBarHeight 的数量。默认号码是50.0。
您也可以从 CupertinoTabBar 类更改 _kTabBarHeight，但这不是建议。

【讨论】：