如何在 Flutter 中显示适合屏幕尺寸的背景图像？

How to display a background image that fits screen sizes in Flutter?

提问人：An Tran 提问时间：7/19/2022 更新时间：7/19/2022 访问量：355

问：

我下面有一个类似的背景图像，当我将其调整为更大的屏幕时，图像 4 个角的细节会失真。4 个角和周围边框如何缩放到屏幕大小？请告诉我解决方案。谢谢！

enter image description here

安卓 iOS Flutter 飞镖 手机

评论

0赞 user18309290 7/19/2022
请分享代码。

答：

1赞 ihatecoding 7/19/2022 #1

首先使用容器或其他方式确保父小部件占用整个空间。然后使用 BoxFit.fill。

Image.network(
   pictureUrl,
   fit: BoxFit.fill,
)
1赞 Adnan Bashir 7/19/2022 #2

将其添加到主容器中

decoration: BoxDecoration(
            image: DecorationImage(
                colorFilter: new ColorFilter.mode(
                    Colors.green.withOpacity(0.8), BlendMode.dstATop),
                image: AssetImage(Utils().homebg),
                fit: BoxFit.fill))

上一个：如何在listview.builder中的项目之间添加延迟？

下一个：在 iOS 上将 airpods 从耳朵中取出时，Flutter 应用程序的声音暂停