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

I have a similar background image below, when I resize it to a larger screen the details in the 4 corners of the image get distorted. How can the 4 corners and surrounding borders scale to the size of the screen? Please tell me the solution. Thanks!

CodePudding user response：

Make sure the parent widget is taking up then entire space first by using container, or other. Then use BoxFit.fill.

Image.network(
   pictureUrl,
   fit: BoxFit.fill,
)

CodePudding user response：

Add this in your main Container

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