容器内图像的颤动不透明度

Posted 2023-03-06

【中文标题】容器内图像的颤动不透明度

【英文标题】：Flutter opacity on image within container

【发布时间】：2019-12-04 17:26:15

【问题描述】：

我找不到使容器内的图像不透明的方法。

Container(
      margin: EdgeInsets.symmetric(
          vertical: 12, horizontal: 8),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(40),
        image: DecorationImage(
            image: AssetImage("images/img.png"),
            fit: BoxFit.scaleDown),
      ),
      child: SomeWidget(),
    )

【参考方案1】：

当您使用 DecorationImage 并且它有一个方法 colorFilter 您可以将其用于不透明度

这是我在代码中如何使用它的示例。

colorFilter: new ColorFilter.mode(Colors.black.withOpacity(0.2), BlendMode.dstATop),

你也可以使用this

【讨论】：

这只会在图像顶部创建一大块不透明的颜色...？也不再需要使用new。

【参考方案2】：

在容器的装饰部分内，就像上面sunny的回答一样，但不是Colors.black 使用Colors.white:

              Container(
                  decoration: BoxDecoration(
                      image: new DecorationImage(
                    image: new AssetImage("assets/images/tankicon.png"),
                    fit: BoxFit.scaleDown,
                    colorFilter: ColorFilter.mode(
                        Colors.white.withOpacity(0.2), BlendMode.dstATop),
                  )),
                  child: