Why doesn't flutter properly blur the whole background image?

Question

I'm trying to apply an ImageFilter on to my image but it only blurs part of it and fades off like this: The Actual Image Partly Blurred Image

As you can see, most of it is properly blurred but you can make out the bottom part.
How I'm blurring it:

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Stack(
      children: [
        ConstrainedBox(
          constraints: const BoxConstraints.expand(),
          child: Image(image: AssetImage(config.wallpaper), fit: BoxFit.cover),
        ),
        Container(
          child: ClipRect(
            child: BackdropFilter(
              filter: ImageFilter.blur(
                  sigmaX: config.blur['sigmaX'] ?? 50,
                  sigmaY: config.blur['sigmaY'] ?? 50),
              child: Container(
                color: Colors.transparent,
                height: 1080,
                width: 1920,
              ),
            ),
          ),
        )
      ],
    ));
  }
}

Answer 1

Maybe you can try stacking a translucent container above the image?

Something like this :

Stack(
  Image(/*your image*/),
  Container(color: Colors.grey.withOpacity(0.6)),
),

You can adjust the color and opacity according to your need. You won't exactly be blurring the image but it will do a good work of hiding that image.