如何在Flutter上的盒子装饰上的图像上添加不透明的覆盖物

问题描述 投票:0回答:1

我正在努力为这个看似简单的任务提供解决方案。我需要在Flutter中的图像上覆盖不透明的图像。我尝试以不同的方式添加叠加,但是图像始终会叠加在我所做的任何事情上。请注意,我需要图像上的不透明覆盖物,而不是图像和覆盖物上的标题或文本。或者,我可能有黑色背景,并使图像不透明,从而可能会产生与我想要的效果相同的效果?在我开始深入研究之前,我想看看专家们是如何做到这一点的。谢谢大家的建议。

                  Container(
                    width: 320.0,
                    height: 180.0,
                    decoration: BoxDecoration(
                      image: DecorationImage(
                        image: NetworkImage(
                            news[index]['jetpack_featured_media_url'],
                        ),
                        fit: BoxFit.cover,
                      ),
                      color: Color(0xFF1F1F98),
                      gradient: LinearGradient(
                        begin: Alignment.topCenter,
                        colors: [Colors.black, Colors.black],
                        stops: [0.0, 0.5]
                      ),
                      borderRadius: new BorderRadius.only(
                          topLeft: const Radius.circular(8.0),
                          topRight: const Radius.circular(8.0)
                      ),
                    ),
                    child: Padding(
                        padding: const EdgeInsets.all(20.0),
                        child: Text(
                            cardTitle(news[index]['title']['rendered']),
                            style: kCardOverlayTitleTextStyle
                        )
                    ) /* add child content here */,
                  ),
flutter flutter-layout
1个回答
1
投票

您可以使用DecoratedImage窗口小部件中可用的ColorFilter选项

© www.soinside.com 2019 - 2024. All rights reserved.