gpt4 book ai didi

flutter - 如何在 flutter 中实现圆形的底部应用栏?

转载 作者:行者123 更新时间:2023-12-04 15:11:31 29 4
gpt4 key购买 nike

我想创建一个像这样的圆形底部应用栏。
圆形底部应用栏:
1
但它看起来像这样......编码的BottomAppBar:
2
我如何摆脱那个白色部分?

    return ClipRRect(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(25),
topRight: Radius.circular(25),
bottomRight: Radius.circular(25),
bottomLeft: Radius.circular(25),
),
child: Padding(
padding: const EdgeInsets.only(bottom:20.0),
child: BottomAppBar(

shape: CircularNotchedRectangle(),
child: new Row(

mainAxisAlignment: MainAxisAlignment.spaceBetween,

children: <Widget>[
IconButton(
icon: Icon(Icons.menu),
color: Colors.white,
onPressed: () {},
),
IconButton(
icon: Icon(Icons.search),
color: Colors.white,
onPressed: () {},
),
],
),
color: Colors.blueGrey,
),
)
); ```

最佳答案

应用栏小部件有一个 shape 属性,这就是您应该使用以获得所需结果的属性,请将您的代码更改为此

BottomAppBar(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.all(
topLeft: Radius.circular(25),
topRight: Radius.circular(25),
bottomRight: Radius.circular(25),
bottomLeft: Radius.circular(25),
),
),
... //Your codes
),

关于flutter - 如何在 flutter 中实现圆形的底部应用栏?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65163586/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com