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

你可以用gradient属性的BoxDecoration来得到你想要的。

我添加了一个演示：

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,
          ),
        ),
      ),
    );
  }
}

结果：

Flutter 平滑颜色过渡容器

Flutter smooth color transition container

flutter

dart

colors

transition