Flutter 平滑顏色過渡容器

Question

我怎么能說一個帶有陰影顏色的容器，如所附圖片？

我不只是使用圖像，因為對其進行細微的更改會困難得多，並且顏色有時需要是整個屏幕寬度，也許我要為它設置動畫。

https://i.stack.imgur.com/2QzXC.jpg

Answer 1

class Gradiant extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        decoration: new BoxDecoration(
          gradient: new LinearGradient(
              colors: [Colors.blue[800], Colors.purple, Colors.red],
              begin: Alignment.bottomCenter,
              end: Alignment.topCenter,
              stops: [0.2, 0.6, 1]),
        ),
      ),
    );
  }
}

Answer 2

你可以使用BoxDecoration的gradient屬性來獲得你想要的。

我添加了一個演示：

class StackOver extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        decoration: BoxDecoration(
          gradient: LinearGradient(
            colors: [
              // use your preferred colors 
              Colors.red[900],
              Colors.blue[900],
            ],
            // start at the top
            begin: Alignment.topCenter,
           // end at the bottom
            end: Alignment.bottomCenter,
          ),
        ),
      ),
    );
  }
}

結果：