Flutter：如何使用 ButtonStyle() 创建圆形的高架按钮？

Question

我想创建一个圆形的高架按钮，按下时会改变颜色。到目前为止，我已经使用 ButtonStyle() 更改颜色，使用代码：

style: ButtonStyle(
                   backgroundColor: MaterialStateProperty.resolveWith((Set<MaterialState> states) { 
       if (states.contains(MaterialState.pressed)) {
            return Colors.black;}
       return Colors.red;}))

这会在触摸时将颜色从红色变为黑色。但我找不到调整按钮大小和创建圆边的方法。我知道如何使用 ElevatedButton.styleForm() 来做到这一点，但是使用 styleForm() 我不知道如何让它在触摸时改变颜色。有没有其他方法可以使用 styleForm 来实现，或者在一个代码中融合两种样式？

Answer 1

使用样式属性您可以创建自己的形状。

 SizedBox(
                    height: 50,
                    child: ElevatedButton(
                        style: ButtonStyle(
                            shape: MaterialStateProperty.all<
                                    RoundedRectangleBorder>(
                                RoundedRectangleBorder(
                                    borderRadius: BorderRadius.circular(18.0),
                                    side: BorderSide(color: Colors.red)))),
                        onPressed: () {
                          Navigator.push(
                              context,
                              MaterialPageRoute(
                                  builder: (context) => SignUp()));
                        },
                        child: const Text("Sign up here")),
                  ),

Flutter：如何使用 ButtonStyle() 创建圆形的高架按钮？

Flutter: How can I create rounded Elevated buttons with ButtonStyle()?

responsive-design

dart

flutter