时间戳

首页 > 解决方案 > Flutter：在浮动操作按钮中使用 appBar 小部件而不是 appBar？

flutter - Flutter：在浮动操作按钮中使用 appBar 小部件而不是 appBar？

问题描述

这是我在 appBar 中使用的小部件；

 appBar: AppBar(actions: <Widget>[myAppBarIcon()],)

以及小部件本身的代码；

Widget myAppBarIcon() {
   return ValueListenableBuilder(
    builder: (BuildContext context, int newNotificationCounterValue,
        Widget child) {
        return  newNotificationCounterValue == 0? Container(): Stack(
        children: [
          Icon(
            Icons.notifications,
            color: Colors.white,
            size: 30,
          ),
          Container(
            width: 30,
            height: 30,                
            child: Container(
              width: 15,
              height: 15,
              decoration: BoxDecoration(
                  shape: BoxShape.circle,
                  color: Color(0xffc32c37),
                  border: Border.all(color: Colors.white, width: 1)),
              child: Padding(
                padding: const EdgeInsets.all(0.0),
                child: Text(
                  newNotificationCounterValue.toString(),
                ),
              ),
            ),
          ),
        ],
      );
    },
    valueListenable: notificationCounterValueNotifer,
  );
}

但我现在想在浮动操作按钮而不是 appBar 中使用小部件。所以这就是我尝试过的；

 Scaffold(
      body: FoldableSidebarBuilder(
        drawerBackgroundColor: Colors.black45,
        drawer: CustomDrawer(closeDrawer: (){
          setState(() {
            drawerStatus = FSBStatus.FSB_CLOSE;
          });
        },),
        screenContents: mainStage(),
        status: drawerStatus,
      ),
      floatingActionButton: Stack(
        children: <Widget>[
          Positioned(
            bottom:140,
            left: 17,
            child: FloatingActionButton(
                mini: true,
                heroTag: null,
                backgroundColor: Colors.black12,
                child: myAppBarIcon()

            ),
          ),         
        ],
      ),
    ),

但是，虽然没有出现错误，但 myAppBarIcon 并没有出现在构建中。我哪里做错了？

标签： flutterdartwidgetflutter-layout

解决方案

事实证明它确实有效。起初我不这么认为，直到我意识到我需要在 FCM 通知出现之前收到它。这条线就是原因。

return  newNotificationCounterValue == 0? Container()

所以我要在容器中放一个空的通知图标。

推荐阅读