当我在容器的子项中使用 BackdropFilter 时,手机屏幕变成黑色。当我删除该编码时。它显示背景图像。出了什么问题?
我想模糊应用程序的背景图像。没有错误显示。但最终渲染是黑屏。没有任何图片
Stack(
children: [
//background image here with blur
Container(
decoration: const BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/u2.jpg'),
fit: BoxFit.cover,
),
),
child: BackdropFilter(
filter: ImageFilter.blur(
sigmaX: 10,
sigmaY: 10,
),
),
),
],),
尝试使用
BackdropFilter
孩子
Positioned.fill(
child: Container(
decoration: const BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/images/u2.jpg'),
fit: BoxFit.cover,
),
),
child: BackdropFilter(
filter: ImageFilter.blur(
sigmaX: 10,
sigmaY: 10,
),
child: Container(
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.0),
),
),
),
),
),
测试脚手架
return Scaffold(
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
SizedBox(
height: 200,
child: Stack(
children: [
Positioned.fill(
child: Container(
decoration: const BoxDecoration(
image: DecorationImage(
image: AssetImage('assets/img.png'),
fit: BoxFit.cover,
),
),
child: BackdropFilter(
filter: ImageFilter.blur(
sigmaX: 10,
sigmaY: 10,
),
child: Container(
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.0),
),
),
),
),
),
],
),
),
],
),
);
使用 ImageFiltered() 小部件而不是 BackDropFilter()