CODEWITHSUNDEEP
flutterimagecontainers
Keppler
Keppler

Reputation: 65

Flutter Container height/width

BoxFit.cover BoxFit.fill

Hey guys, so my problem is that the image should take all the space in the box (I got that) but the image looks weird. Could you help me?

child: Container(
                    margin: const EdgeInsets.fromLTRB(10, 20, 10, 20),
                    decoration: BoxDecoration(
                      border: Border.all(
                        width: 2,
                        color: Colors.grey.shade700,
                      ),
                    ),
                    height: 350,
                    width: 350,
                    child: Container(
                        height: 350,
                        width: 350,
                        child: FittedBox(child: infoBank[PicNumber].image,
                        fit: BoxFit.fill,
                        ),
                    ),
                  ),

Upvotes: 0

Views: 2038

Answers (1)

fravolt
fravolt

Reputation: 3001

You can do this using BoxFit.cover in your Image:

fit: BoxFit.cover

Alternatively, use BoxFit.fillHeight or BoxFit.fillWidth where appropriate for only one direction.

child: Image.network(
 'https://upload.wikimedia.org/wikipedia/commons/thumb/e/e3/Peanuts_maize_chips_2.jpg/1920px-Peanuts_maize_chips_2.jpg',
 fit: BoxFit.cover,
),

Upvotes: 1

Related Questions