Saya memiliki gambar yang tidak cocok dengan rasio aspek layar perangkat saya. Saya ingin meregangkan gambar sehingga memenuhi layar sepenuhnya, dan saya tidak ingin memotong bagian mana pun dari gambar.
CSS memiliki konsep persentase, jadi saya bisa mengatur tinggi dan lebar menjadi 100%. Tapi sepertinya Flutter tidak memiliki konsep itu, dan itu buruk untuk hanya membuat kode tinggi dan lebar, jadi saya mandek.
Berikut ini sampel dasarnya, kita akan menyesuaikan gambar dengan 100% lebar wadah sementara tingginya konstan. Untuk aset lokal, gunakan AssetImage;
Container(
width: MediaQuery.of(context).size.width,
height: 100,
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.fill,
image: NetworkImage("https://picsum.photos/250?image=9"),
),
),
)
fit: BoxFit.fill
fit: BoxFit.fitHeight
Gambar tetap proporsional sambil memastikan tinggi penuh gambar ditampilkan (mungkin meluap).
fit: BoxFit.fitWidth
Gambar tetap proporsional sambil memastikan lebar penuh gambar ditampilkan (mungkin meluap).
fit: BoxFit.cover
Gambar tetap proporsional, memastikan cakupan maksimum wadah (mungkin meluap).
fit: BoxFit.contain
Gambar dijaga proporsional, seminimal mungkin, akan mengurangi ukurannya jika diperlukan untuk menampilkan seluruh gambar.
