Flutter BottomNavigationBarItem 只接受 Icon 而没有其他小部件？

在我们的 Flutter Cupertino 项目中，我们需要在底部栏图标之一上显示一个徽章。准确地说，购物车中已有多少商品。

我尝试了此处提供的不同小部件和解决方案，但 BottomNavigationBarItem 仅接受 icon: Icon(..) 而没有其他任何内容。例如，如果我将 icon: Stack(..) 而不是 icon: Icon(..) ，则会显示错误消息，例如
“无效的常量值...”

下面是一些示例代码:

class CupertinoStoreHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return CupertinoTabScaffold(
      tabBar: CupertinoTabBar(
        items: const <BottomNavigationBarItem>[
          BottomNavigationBarItem(
            icon: Icon(CupertinoIcons.home),
            title: Text('Kühlschrank'),
          ),
          BottomNavigationBarItem(
            icon: Icon(CupertinoIcons.profile_circled),
            title: Text('Konto'),
          ),
          BottomNavigationBarItem(
            icon: Icon(CupertinoIcons.shopping_cart),
            title: Text('Warenkorb'),
          ),
        ],
      ),

所以如果我不能放任何东西而不是 Icon(..) 。没有其他小部件，没有 Stack(..) 。

为什么？我如何放置其他小部件，例如 Badge(..) :

badges: ^1.0.2
import 'package:badges/badges.dart';

这个问题与可能的重复问题不同，因为我已经尝试了那里发布的解决方案，但仍然无法使用 Stack(..) 而只能使用 Icon(..)。

最佳答案

我尝试重现该问题，但在更改一些内容后它确实有效。首先， icon 属性接受 Widget ，因此不仅是 Icon ，所以这不是问题。

但是，我确实注意到，在 items: const <BottomNavigationBarItem>[ 中，您应该删除 const 关键字，因为它不是必需的，也不是常量。

最后，您需要向 CupertinoTabScaffold 添加一个选项卡构建器，这基本上返回底部导航栏上方显示的内容。

您的最终代码如下所示:

return CupertinoTabScaffold(
      tabBuilder: (BuildContext context, int i) {
        return CupertinoActivityIndicator();
      },
      tabBar: CupertinoTabBar(
        items: <BottomNavigationBarItem>[
          BottomNavigationBarItem(
            icon: Badge(
              badgeContent: Text('3'),
              child: Icon(Icons.settings),
            ),
            title: Text('Kühlschrank'),
          ),
          BottomNavigationBarItem(
            icon: Icon(CupertinoIcons.profile_circled),
            title: Text('Konto'),
          ),
          BottomNavigationBarItem(
            icon: Icon(CupertinoIcons.shopping_cart),
            title: Text('Warenkorb'),
          ),
        ],
      ),
    );

关于Flutter BottomNavigationBarItem 只接受 Icon 而没有其他小部件？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/56460230/