如何在卡片中添加渐变颜色？

Question

如何在卡片背景中添加渐变色？我应该用容器和盒子装饰复制这张卡片还是有其他简单的方法？

Answer 1

尝试下面的代码希望它对您在下面的答案中有所帮助，改变您需要的颜色。

         Card(
            child: Container(
              height: 50,
              width: 150,
              decoration: BoxDecoration(
                gradient: LinearGradient(
                  colors: [
                    Colors.yellow,
                    Colors.orangeAccent,
                    Colors.yellow.shade300,
                  ],
                  begin: Alignment.topLeft,
                  end: Alignment.bottomRight,
                ),
              ),
              child: Container(), //declare your widget here
            ),
          ),

你的卡片看起来像->

如果您是卡片的渐变背景或卡片的渐变边框，请尝试以下代码

  Container(
        
          height: 50,
          width: 150,
          decoration: BoxDecoration(
            gradient: LinearGradient(
              colors: [
                Colors.yellow,
                Colors.orangeAccent,
                Colors.yellow.shade300,
              ],
              begin: Alignment.topLeft,
              end: Alignment.bottomRight,
            ),
          ),
        child:Card(
          color:Colors.white,
          child: Container(), //declare your widget here
        ),
      ),

你的屏幕就像 ->

Answer 2

这是我刚刚尝试过的示例。对我来说效果很好。

Container(
            decoration: BoxDecoration(
                gradient: LinearGradient(
                    colors: [Colors.black, Colors.white],
                    begin: Alignment.topLeft,
                    end: Alignment.bottomRight)),
          )