如何向底部导航栏添加渐变?

时间:2021-01-16 21:39:52

标签: flutter

如何在没有包的情况下为默认的底部导航栏添加渐变?

    bottomNavigationBar: Container(
      decoration: BoxDecoration(
          gradient: LinearGradient(
              begin: Alignment.centerLeft,
              end: Alignment.centerRight,
              colors: [Colors.grey[600], Colors.grey[900]])),
      height: getBottomBarSize(),
      child: BottomAppBar(

          //color: Colors.grey[900],
          child: getChild()),
    ),

我试过这个,但它不起作用。有没有另一种方法可以在不编写自己的导航栏或使用包的情况下尝试?

谢谢:)

1 个答案:

答案 0 :(得分:2)

这是因为 BottomAppBar 小部件的默认行为。您实际上并没有看到 Container 渐变,因为 BottomAppBar 颜色隐藏了它。
像这样颠倒你的小部件顺序

bottomNavigationBar: BottomAppBar(
  child: Container(
    decoration: BoxDecoration(
      gradient: LinearGradient(
        begin: Alignment.centerLeft,
        end: Alignment.centerRight,
        colors: [Colors.grey[600], Colors.grey[900]],
      ),
    ),
    height: getBottomBarSize(),
    child: getChild(),
  ),
),