如何向我的图像添加线性渐变叠加？

Question

我正在使用 flutter，但无法将线性渐变叠加到我的图像上。

我尝试了一些解决方案，但没有一个有效，有人可以向我解释如何才能得到图像中显示的结果吗？图片来自网络。

谢谢

Answer 1

您可以使用“堆栈”小部件将线性渐变叠加添加到图像，以将小部件相互叠加。

这是一个例子

Stack(
        children: <Widget>[
     
          Image.network(
            'https://example.com/your-image.jpg',
            width: double.infinity,
            height: double.infinity,
            fit: BoxFit.cover,
          ),
          
          Container(
            width: double.infinity,
            height: double.infinity,
            decoration: BoxDecoration(
              gradient: LinearGradient(
                begin: Alignment.topCenter,
                end: Alignment.bottomCenter,
                colors: [
                  Colors.transparent, 
                  Colors.black.withOpacity(0.6),
                ],
              ),
            ),
          ),
        ],
      ),