我正在尝试创建这样的按钮。

flutter - FlatButton中的两种颜色-LMLPHP

以下是平面按钮代码。但是我没有得到理想的结果。

FlatButton(
            padding: EdgeInsets.all(15),
            color: Colors.orange,
            textColor: Colors.white,
            child: Text(
              'NEXT',
              style: TextStyle(
                fontSize: 18,
                fontWeight: FontWeight.bold,
              ),
            ),
            shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(6)),
            onPressed: () => _nextButtonTapped,
          )

如何在平面按钮的背景中设置两种颜色?

最佳答案

具有飞溅效果的示例代码。

class SO extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    const double br = 10;
    return Scaffold(
      body: Center(
        child: Ink(
          padding: EdgeInsets.zero,
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(br),
            gradient: LinearGradient(
              begin: Alignment(.05, -1),
              end: Alignment(-.05, 1),
              stops: [.5, .5],
              colors: <Color>[
                Colors.deepOrange,
                Colors.orange,
              ],
            ),
          ),
          child: FlatButton(
            shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(br)),
            textColor: Colors.white,
            materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
            onPressed: () {},
            splashColor: Colors.red,
            child: const Text(
              'this is a button',
            ),
          ),
        ),
      ),
    );
  }
}

这使

flutter - FlatButton中的两种颜色-LMLPHP

关于flutter - FlatButton中的两种颜色,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/60182132/

10-11 19:52