How to make a staggeredGridView
in flutter which have 2 rows . In first row there will be two images and in second row there will be three images and in last image of the 2nd row there will be some text like 20+ or 40+.
have a look at the following image for better understanding
body: Padding(
child: Container
(
height: 1500,
decoration: BoxDecoration(
color: Colors.white,
),
child: StaggeredGridView.count(
crossAxisCount: 4,
mainAxisSpacing: 3.0,
crossAxisSpacing: 3.0,
staggeredTiles: [
StaggeredTile.count(2, 1),
StaggeredTile.count(2, 1),
StaggeredTile.count(1, 1),
StaggeredTile.count(1, 1),
StaggeredTile.count(1, 1),
StaggeredTile.count(1, 1),
],
children: <Widget>[
myPhotoList(
"https://www.google.com/search?q=bird&rlz=1C1CHBD_enBD884BD884&sxsrf=ALeKk032QyXLy5s0te6Y52Sp3yyA2g4sfQ:1598990850500&source=lnms&tbm=isch&sa=X&ved=2ahUKEwjslZKN4cjrAhUWWX0KHe3sAdMQ_AUoAXoECB0QAw&biw=1536&bih=792#imgrc=1ois95B-LwbEBM"),
myPhotoList(
"https://www.google.com/search?q=bird&rlz=1C1CHBD_enBD884BD884&sxsrf=ALeKk032QyXLy5s0te6Y52Sp3yyA2g4sfQ:1598990850500&source=lnms&tbm=isch&sa=X&ved=2ahUKEwjslZKN4cjrAhUWWX0KHe3sAdMQ_AUoAXoECB0QAw&biw=1536&bih=792#imgrc=1ois95B-LwbEBM"),
myPhotoList(
"https://www.google.com/search?q=bird&rlz=1C1CHBD_enBD884BD884&sxsrf=ALeKk032QyXLy5s0te6Y52Sp3yyA2g4sfQ:1598990850500&source=lnms&tbm=isch&sa=X&ved=2ahUKEwjslZKN4cjrAhUWWX0KHe3sAdMQ_AUoAXoECB0QAw&biw=1536&bih=792#imgrc=1ois95B-LwbEBM"),
myPhotoList(
"https://www.google.com/search?q=bird&rlz=1C1CHBD_enBD884BD884&sxsrf=ALeKk032QyXLy5s0te6Y52Sp3yyA2g4sfQ:1598990850500&source=lnms&tbm=isch&sa=X&ved=2ahUKEwjslZKN4cjrAhUWWX0KHe3sAdMQ_AUoAXoECB0QAw&biw=1536&bih=792#imgrc=1ois95B-LwbEBM"),
myPhotoList(
"https://www.google.com/search?q=bird&rlz=1C1CHBD_enBD884BD884&sxsrf=ALeKk032QyXLy5s0te6Y52Sp3yyA2g4sfQ:1598990850500&source=lnms&tbm=isch&sa=X&ved=2ahUKEwjslZKN4cjrAhUWWX0KHe3sAdMQ_AUoAXoECB0QAw&biw=1536&bih=792#imgrc=1ois95B-LwbEBM"),
myPhotoList(
"https://www.google.com/search?q=bird&rlz=1C1CHBD_enBD884BD884&sxsrf=ALeKk032QyXLy5s0te6Y52Sp3yyA2g4sfQ:1598990850500&source=lnms&tbm=isch&sa=X&ved=2ahUKEwjslZKN4cjrAhUWWX0KHe3sAdMQ_AUoAXoECB0QAw&biw=1536&bih=792#imgrc=1ois95B-LwbEBM"),
Details(),
],
),
),
),
Widget myPhotoList(String img) {
return Container(
decoration: BoxDecoration(
image: DecorationImage(
fit: BoxFit.fill,
image: NetworkImage(
img),
),
),
);
}
Are you looking for this?