Flutter实现毛玻璃

基本实现：

Stack(
  alignment: Alignment.center,
  children: [
    Container(
      child: FlutterLogo(
        size: 500,
      ),
      height: 500,
      width: 500,
      alignment: Alignment.center,
    ),
    Center(
      child:  ClipRect(
        child:  BackdropFilter(
          filter: ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0),
          child:  Container(
            width: 200.0,
            height: 200.0,
            decoration:  BoxDecoration(
                color: Colors.white.withOpacity(0.1)
            ),
            child:  Center(
              child:  Text(
                '毛玻璃效果',
              ),
            ),
          ),
        ),
      ),
    ),
  ],
)

核心

//使用图片毛玻璃与背景色透明度来实现毛玻璃效果
BackdropFilter(
          filter: ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0),


//背景色透明度
decoration:  BoxDecoration(
                color: Colors.white.withOpacity(0.1)
            ),