下面是我期望的设计:
下面是它在下面代码中的当前外观:
当前代码:
我试过这个代码与半径圆:
使用Radius.circular,但这仍然没有产生预期结果,而是显示为仍在角落的不正确图标:
Radius.circular
ni65a41a1#
请尝试以下代码:
FloatingActionButton( onPressed: () {}, backgroundColor: const Color.fromRGBO(238, 0, 0, 1), shape: const RoundedRectangleBorder( // <= Change BeveledRectangleBorder to RoundedRectangularBorder borderRadius: BorderRadius.only( topLeft: Radius.circular(30.0), topRight: Radius.circular(10.0), bottomLeft: Radius.circular(30.0), bottomRight: Radius.circular(30.0), ), ), child: const Image( width: 40, height: 40, image: AssetImage('images/chatbot-icon.png'), ), ),
z9ju0rcb2#
将BeveledRectangleBorder更改为RoundedRectangularBorder使用以下代码:
BeveledRectangleBorder
RoundedRectangularBorder
return Scaffold( floatingActionButton: FloatingActionButton( onPressed: () {}, backgroundColor: const Color.fromRGBO(238, 0, 0, 1), shape: const RoundedRectangleBorder( borderRadius: BorderRadius.only( topRight: Radius.circular(20), bottomLeft: Radius.circular(100), bottomRight: Radius.circular(100), topLeft: Radius.circular(100))), ), );
输出:
2条答案
按热度按时间ni65a41a1#
请尝试以下代码:
z9ju0rcb2#
将
BeveledRectangleBorder
更改为RoundedRectangularBorder
使用以下代码:
输出: