Flutter: Image Height Dynamic Will Be Changed According To Text Height Increase And Decrease

i set an image on top and multiple line text on bottom in GridView-builder index. next i want image height size will be changed dynamically while text line will be changed. suppose, when bottom text line will increase then top image height will be deceased in index.

 class category_route extends StatelessWidget {


 @override
 Widget build(BuildContext context) {



var sizeDevice = MediaQuery.of(context).size;
final orientation = MediaQuery.of(context).orientation;

final double itemHeight = (sizeDevice.height - kToolbarHeight - 24) / 3;
final double itemWidth = sizeDevice.width / 3;



return MaterialApp(
  home: Scaffold(

    backgroundColor: Colors.yellow,

    body: GridView.builder(
      padding: EdgeInsets.all(8),
      itemCount: categoryTitleArray.length,
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: (orientation == Orientation.portrait) ? 3 : 4,
        crossAxisSpacing: 5,
        mainAxisSpacing: 5,
        childAspectRatio: (itemWidth / itemHeight),
      ),


      itemBuilder: (BuildContext context, int index) {
        return new Card(

        child: new GridTile(
          
            child:  Image.asset(categoryImageArray[index],
            ),
            footer: Text("${categoryTitleArray[index]}"),

          ),
        );
      },
    ),


  ),
);
}
}

instead of using GridTile Please use this

return 
new Card(
  child: new Column(
    children: [
      Expanded(
        child: Image.network(
          categoryImageArray[index],
        ),
      ),
      Text("${categoryTitleArray[index]}")
    ],
  ),
);

I tested this and working perfectly. Hope I answer the question.