Flutter 徽章包 - 如何不动态显示 zero/update？

Question

我正在使用带有 flutter 的 Badges 包来显示没有。看不见的通知作为底部导航栏中图标的徽章。我的底部导航栏小部件

  Widget homeBottomBar() {
    final notificationNotifier =
        Provider.of<NotificationNotifier>(context, listen: false);
    ProfileModel profile = profileNotifier(true).profile;
    var _unseenCount;

    return Container(
      height: MediaQuery.of(context).size.height * 0.072,
      decoration: const BoxDecoration(
        border: Border(
          top: BorderSide(
            color: Colors.black38,
            width: 0.54,
          ),
        ),
      ),
      child: BottomNavigationBar(
        type: BottomNavigationBarType.fixed,
        unselectedItemColor: Colors.grey[700],
        selectedItemColor: Colors.black,
        showSelectedLabels: true,
        showUnselectedLabels: false,
        currentIndex: bottomBarIndex,
        selectedLabelStyle: const TextStyle(fontWeight: FontWeight.bold),
        onTap: (index) => setState(() => bottomBarIndex = index),
        items: [
          const BottomNavigationBarItem(
              icon: Icon(CupertinoIcons.house_fill), label: 'Feeds'),
          const BottomNavigationBarItem(
              icon: Icon(Icons.people_alt_rounded), label: 'People'),
          BottomNavigationBarItem(
              icon: profile.profileId.isNotEmpty
                  ? Badge(
                      child: Icon(
                        CupertinoIcons.bell_solid,
                        color: bottomBarIndex == 3 ? Colors.black : Colors.grey,
                      ),
                      badgeColor: Colors.red,
                      showBadge: _unseenCount == 0 ? false : true,
                      animationType: BadgeAnimationType.fade,
                      badgeContent: FutureBuilder(
                        future: notificationNotifier.getUnseenCount(
                            profileId: profile.profileId),
                        builder: (context, snapshot) {
                          _unseenCount = snapshot.data;
                          print(_unseenCount.runtimeType);
                          if (snapshot.connectionState ==
                              ConnectionState.waiting) {
                            return const SizedBox(
                              height: 22.5,
                              width: 0,
                            );
                          }
                          return Column(
                            children: [
                              Text(
                                _unseenCount.toString(),
                                style: const TextStyle(
                                  fontSize: 12.6,
                                  fontWeight: FontWeight.bold,
                                ),
                              ),
                            ],
                          );
                        },
                      ),
                    )
                  : const Icon(CupertinoIcons.bell_solid),
              label: 'Notifications'),
        ],
      ),
    );
  }

我尝试使用 _unseenCount 设置 showBadge 布尔值，但这也没有帮助。

现在是这样的：

如何正确设置布尔值 showBadge 以便它是动态的并在计数发生变化时得到更新？

Answer 1

您正在为 badgeContent 使用 FutureBuilder，它可以正确获取值并构建徽章内容。但是，showBadge 没有放置在这个构建器下，我认为这是导致您描述的行为的原因。

一种可能的解决方案是将 FutureBuilder 向上移动一个级别，以便在未来完成后重建整个 Badge 小部件

Flutter 徽章包 - 如何不动态显示 zero/update？

Flutter badges package - How to not show zero/update dynamically?

boolean

badge

flutter

flutter-provider

flutter-futurebuilder