小部件的一部分模糊的问题

Question

我在使小部件的一部分变得模糊时遇到问题（我正在使用堆栈）。

return Scaffold(
      body: Stack(
        children: [

        Padding(
          //sth very nice
        ),
        Positioned(
          top: 0,
          bottom: height*0.85,
          right: 0,
          left: 0,
            child: BackdropFilter(
              filter: ui.ImageFilter.blur(
                sigmaX: 5, sigmaY: 5,
              ),
              child: Container(color: Colors.transparent,)
          ),
        )
      ],
      ),
    );

我想要的是页面顶部的一个小模糊区域，覆盖下面的小部件（在本例中为填充的内容）。

实际上，我所拥有的是模糊效果覆盖了整个屏幕，这非常有趣，因为在我的堆栈中我有一个具有精确尺寸的

Positioned

小部件。看来模糊效果已经超出极限了...

我放了整个模糊屏幕的图像：

Answer 1

用 ClipRect 小部件包裹堆栈小部件