flutter 如何删除底部导航栏中浮动操作按钮的白色背景?

c2e8gylq  于 2022-11-17  发布在  Flutter
关注(0)|答案(1)|浏览(207)

我已经添加了底部导航栏,其中浮动操作是在中心显示白色背景。我想删除浮动操作按钮的白色背景。我希望它是透明的。我已经尝试了某些事情,但不能弄清楚。我如何才能删除它的白色背景?任何帮助将不胜感激。我已经添加了它的截图如下。

floatingActionButton: Container(
    height: 64.h,
    width: 64.h,
    child: Visibility(
      visible: !showFab,
      child: FloatingActionButton.extended(
        backgroundColor: PayNestTheme.primaryColor,
        onPressed: () {
          payNow = -1;
          bottomTabIsActive = false;
          setState(() {});
        },
        label: Text(
          paynow,
          textAlign: TextAlign.center,
          style: PayNestTheme.floating_12primaryColor.copyWith(
            color: PayNestTheme.colorWhite,
            fontSize: sizes.fontRatio * 12,
          ),
        ), //icon inside button
      ),
    ),
  ),
  floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
  bottomNavigationBar: AnimatedBottomNavigationBar.builder(
    itemCount: selectedIcons.length,
    tabBuilder: (int index, bool isActive) {
      bottomTabIsActive = isActive;
      return Column(
        mainAxisSize: MainAxisSize.min,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          SvgPicture.asset(
            bottomTabIsActive
                ? selectedIcons[index]
                : unSelectedIcons[index],
          ),
          const SizedBox(
            height: 8,
          ),
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 8),
            child: Text(
              "${names[index]}",
              maxLines: 1,
              style: TextStyle(
                color: Colors.white,
                fontSize: sizes.fontRatio * 8,
                fontFamily: 'montserratMedium',

              ),
            ),
          )
        ],
      );
    },
    backgroundColor: PayNestTheme.primaryColor,
    activeIndex: pageIndex,
    splashColor: PayNestTheme.blueAccent,
    splashSpeedInMilliseconds: 0,
    notchMargin: sizes.heightRatio * 8,
    hideAnimationCurve: Curves.linear,
    notchSmoothness: NotchSmoothness.softEdge,
    gapLocation: GapLocation.center,
    leftCornerRadius: 16,
    rightCornerRadius: 16,
    onTap: (index) {
      payNow = 0;
      selectedNavItem(index);
    },
    shadow: BoxShadow(
      offset: Offset(0, 1),
      blurRadius: 12,
      spreadRadius: 0.5,
      color: Colors.grey,
    ),
  ),

qc6wkl3g

qc6wkl3g1#

Scaffold中设置extendBody: true

Scaffold(
  extendBody:true,
  // your bottombar
)

相关问题