首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >ImageFilter.blur (BackdropFilter)不工作

ImageFilter.blur (BackdropFilter)不工作
EN

Stack Overflow用户
提问于 2022-11-19 18:22:12
回答 1查看 24关注 0票数 1

当我在容器的孩子中使用BackdropFilter时,手机屏幕会变成黑色。当我删除那个编码时。它显示背景图像。出什么问题了?

我想模糊我的背景图像的应用程序。没有错误显示。但最终渲染是黑色屏幕。没有任何图像

代码语言:javascript
复制
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,
            ),
          ),
        ),
],),
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2022-11-19 18:27:54

尝试使用BackdropFilter

代码语言:javascript
复制
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),
        ),
      ),
    ),
  ),
),

试验脚手架

代码语言:javascript
复制
 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),
                      ),
                    ),
                  ),
                ),
              ),
            ],
          ),
        ),
      ],
    ),
  );
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/74502533

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档