[Flutter] How to make a gridview for all devices in Flutter?

I have a regular GridView with an image and a text below it in my app. I recently used device preview to see how it appears on other devices and it appears very different on tablets vs on small phones. Is it possible to make a single grid with even spacing on all devices so that it doesn't differ so much? This is my code:

GridView.builder(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 3,
mainAxisSpacing: 15.0,
crossAxisSpacing: 10.0,
childAspectRatio: MediaQuery.of(context).size.width /
(MediaQuery.of(context).size.height / 1.92),
),
itemCount: 100,
itemBuilder: (context, index) {
return Column(
children: <Widget>[
Expanded(
child: ClipRRect(
borderRadius: BorderRadius.all(Radius.circular(15.0)),
child: GridTile(
child: Image.network(
'https://lh3.googleusercontent.com/proxy/DC95dZwFErJk5toYcgiDngZbOnQuvHsZHMe7hIUol_dlykLi3xgJljZlljxJJU2WM2jACnOpHXjidqamjHWIOQ6DrABhkXahUzKwQSIC9dXPGJb8NhqJiLxRNcEEQseKAH9DlEHYgBEsMtY8pqubmv3HU2L15i5CJyuGs5XFhw',
height: 150,
fit: BoxFit.fill,
),
),
),
),
Padding(
padding: const EdgeInsets.only(top: 2.0),
child: RichText(
overflow: TextOverflow.ellipsis,
textAlign: TextAlign.center,
maxLines: 1,
text: TextSpan(
text: 'Hello',
style: kTasksStyle.copyWith(
color: kDarkBlue,
fontSize: getValueForScreenType<double>(
context: context, mobile: 14, tablet: 20),
),
),
)),
],
);
},
),


This is how it appears on a small android phone (320x560):

And this is how it appears on a tablet:

Continue reading...