如何在Flutter中创建具有线性渐变的模糊

Question

我正试图在Flutter内部创建一个小部件，它的作用类似于BackdropFilter小部件，并模糊它后面的任何东西。虽然与BackdropFilter不同，但这种模糊度不应该均匀分布，而是线性地逐渐增加。

有人有什么想法吗。感谢

Answer 1

现在似乎可以使用新的ImageFiltered小部件了。

我通过GitHub的评论找到了一个代码示例：

Stack(
alignment: Alignment.bottomCenter,
fit: StackFit.expand,
children: <Widget>[
Image.network(
image,
fit: BoxFit.cover,
alignment: Alignment.bottomCenter),
ImageFiltered(
imageFilter: ImageFilter.blur(sigmaX: 10, sigmaY: 10),
child: ShaderMask(
shaderCallback: (rect) {
return LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [Colors.black, Colors.black.withOpacity(0)],
stops: [0.4, 0.75]).createShader(rect);
},
blendMode: BlendMode.dstOut,
child: Image.network(
image,
fit: BoxFit.cover,
alignment: Alignment.bottomCenter),
)
),
])