flutter - Flutter 自定义形状按钮小部件

Question

嗨，我正在将 html/css 设计转换为 dart 代码来构建这个自定义按钮形状的小部件。我认为需要一些画家的技能。任何人都可以帮忙吗？

标签： flutterdartflutter-layoutcustom-painter

Answer 1

您可以使用BeveledRectangleBorder来获得此形状：-

Material(
            clipBehavior: Clip.antiAlias,
            color: Colors.black,
            shape: BeveledRectangleBorder(
              borderRadius: BorderRadius.only(
                topLeft: Radius.circular(30),
                bottomRight: Radius.circular(30),
              ),
            ),
            child: Container(
              alignment:Alignment.center,
              height: 80,
              width: 180,
              color:Colors.black,
              child: Text("Apply now",style:TextStyle(color:Colors.white)),
            ),
          ),