flutter - 如何在flutter中实现圆角bottomAppbar?
问题描述
我想创建一个像这样的圆形底部应用栏。
圆角BottomAppBar:
但它看起来像这样......编码的BottomAppBar:
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
),
推荐阅读
- git - -CHEAD 在 git commit 中是什么意思?
- c# - 使用 mimekit 解密带有附件的电子邮件
- r - 将 splice() 的输出保存到文本文件
- node.js - MongoDB不更新
- install4j - 任务管理器中的 2 个安装程序进程
- python - 使用用户输入选择要修改的变量?
- docker - 每当 docker hub 上有新的 alpine 的 python 补丁版本可用时,如何配置dependabot.yml 进行更新?
- python - 如何在Python中散点图二维数组
- postgresql - Postgresql 12 通过运行分析修复了 Slave 上的高 CPU 峰值。无法进行 RCA
- python - 避免 IndexError : 列表索引超出范围