使用ShaderMask将LinearGradient放在Widget的前面

Question

我正试图在Flutter中实现这一目标：

所以我做了这个StatelessWidget：

class Scrim extends StatelessWidget {
  Scrim({
    @required this.child
  });

  final Widget child;

  @override
  Widget build(BuildContext context) {
    return ShaderMask(
      shaderCallback: (Rect bounds) {
        return LinearGradient(
          begin: Alignment.topCenter,
          end: Alignment.bottomCenter,
          colors: [Colors.black45, Colors.transparent],
        ).createShader(bounds);
      },
      blendMode: BlendMode.darken,
      child: child,
    );
  }
}

但是我找不到blendMode以使它看起来像我想要的样子。有提示吗？

Answer 1

要实现该效果，您必须使用Stack小部件。 Stack有一个children属性，它只是一堆相互堆叠的小部件。

因此，您将拥有：

堆栈

• 图片
• GradientOverlay

无法使用ShaderMask来满足您的需求。