How to make image layout inside card like this? - flutter

Question

I receive a list of images from api call, I need to layout these images like on this example, I have already implemented this logic, but I think it is redundant, and can be done easier, without hard-coded which item need to be first, last, etc.. and I think that widget tree could be less. How I can improve this code?
my emplementation:
List<Widget> _listImages() {
List<Widget> imagesList = [];
for (int i = 0; i < images.length; i++) {
imagesList.add(
Expanded(
child: Padding(
padding: const EdgeInsets.all(2.0),
child: GestureDetector(
onTap: () {
open(context);
},
child: child: NetworkImage(images[i]),
),
),
);
);
}
return imagesList;
}
Widget build(BuildContext context) {
return Card(...
Column(//Image layout
children: [
Row(
children: [
_listImages().first,
],
),
Container(
height: 110,
child: Row(
children: [
Expanded(
flex: 2,
child: Row(
children: _listImages().getRange(1, 3).toList(),
),
),
Expanded(
child: Stack(children: [
Row(
children: [
_listImages().elementAt(3),
],
),
IgnorePointer(
child: Padding(
padding: const EdgeInsets.all(2.0),
child: Container(
color: Colors.black54,
child: Center(
child: Text(
'+ ${_listImages().length - 3}',
textAlign: TextAlign.center,
style: TextStyle(
color: Colors.white,
fontSize: 22,
fontWeight: FontWeight.w500),
),
),
),
),
),
]),
),
],
),
),
],
)
....
}

Answer 1

You could try Gridview. You can use main axis spacing and cross axis spacing to change the distance between grid tiles.
https://www.geeksforgeeks.org/flutter-gridview/