Flutter Card height not changing with respect to its Child Content

Question

> Every things working fine but When I change Name of product its bottom pixels overflowed :(;

class VerticalProductItemWidget extends StatelessWidget {
final ProductModel product;

const VerticalProductItemWidget({Key key, this.product}) : 
super(key: key);

@override
Widget build(BuildContext context) {
final screenHeight = MediaQuery.of(context).size.height;
  return GestureDetector(

Here My Card Start with some decorations Even when I change picture size its overflowed by some pixles. child: Padding( padding: const EdgeInsets.all(8.0),

    child: Card(
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(20.0),
      ),
      color: Color(0xFFFCFCFC),
      child: Container(
        // padding: const EdgeInsets.all(10),
        // color: productt.backgroundColor,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: <Widget>[
            Padding(
                padding: const EdgeInsets.only(top: 10.0),
                child: Hero(
                    tag: product.imagepath.toString(),
                    child: FadeInImage.assetNetwork(
                      placeholder: 
   'assets/images/image_placeholder.png',
                      image: product.imagepath.toString(),
                      height: 100,
                    ))),
            Text(
              product.productname,
              style: TextStyle(
                  fontWeight: FontWeight.w400,
                  color: Color(0xFF3B3B43),
                  fontSize: 16),
            ),
            Divider(
              height: 4,
              indent: 10,
              endIndent: 10,
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Text(
                  'Rs: ',
                  style: TextStyle(
                      fontWeight: FontWeight.w400,
                      color: Color(0xFF050405),
                      fontSize: 14),
                ),
                Text(
                  product.saleprice.toString(),
                  style: TextStyle(
                      fontWeight: FontWeight.w400,
                      color: Color(0xFF3B3B43),
                      fontSize: 14),
                ),
                Text(
                  '.00',
                  style: TextStyle(
                      fontWeight: FontWeight.w400,
                      color: Color(0x703B3B43),
                      fontSize: 8),
                ),
              ],
            ),
          ],
        ),
      ),
      elevation: 5,
    ),
  ),
[![enter image description here][1]][1] );
 }
}

Final result is here as image of screen. Did any one have the same problem Any Solution please

Answer 1

Widget getData(image1,image2,n1,n2,rat1,rat2,p1,p2){
return Expanded(
child: Container(
  child: Row(
    mainAxisAlignment: MainAxisAlignment.spaceBetween,
    children: [
      SizedBox(width: 15,),
      Expanded(
        child: Container(
          margin: EdgeInsets.only(top: 20),
          child: Stack(
            children: [
              Container(
                height: 200,
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(20),
                  image: DecorationImage(
                      image: AssetImage(image1),
                      fit: BoxFit.cover
                  ),
                ),
                alignment: Alignment.bottomCenter,
                child: Container(
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.only(
                        bottomLeft: Radius.circular(20),
                        bottomRight: Radius.circular(20)),
                    color: Colors.black.withOpacity(0.4),
                  ),
                  height: 40,
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Container(
                        margin: EdgeInsets.only(
                          left: 5,
                          right: 5,
                        ),
                        child: Text(
                          '$n1',style: TextStyle(color: Colors.white,letterSpacing: 1),
                        ),),
                      Text('$p1',style: TextStyle(color: Colors.white,letterSpacing: 1),),
                    ],
                  ),
                ),
              ),
              Container(
                padding: EdgeInsets.only(left: 10),
                height: 25,
                width: 60,
                decoration: BoxDecoration(
                  color: Colors.green,
                  borderRadius: BorderRadius.only(
                      topLeft: Radius.circular(20),
                      bottomRight: Radius.circular(4)),
                ),
                child: Center(
                  child: Row(
                    children: [
                      Text('$rat1',style: TextStyle(color: Colors.white),),
                      Icon(Icons.star,color: Colors.white,),
                    ],
                  ),
                ),
              )
            ],
          ),
        ),
        flex: 1,
      ),
      SizedBox(width: 15,),
      Expanded(
        child: Container(
          margin: EdgeInsets.only(top: 20),
          child: Stack(
            children: [
              Container(
                height: 200,
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(20),
                  image: DecorationImage(
                      image: AssetImage(image2),
                      fit: BoxFit.cover
                  ),
                ),
                alignment: Alignment.bottomCenter,
                child: Container(
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.only(
                        bottomLeft: Radius.circular(20),
                        bottomRight: Radius.circular(20)),
                    color: Colors.black.withOpacity(0.4),
                  ),
                  height: 40,
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Container(
                        margin: EdgeInsets.only(
                          left: 5,
                          right: 5,
                        ),
                        child: Text(
                          '$n2',style: TextStyle(color: Colors.white,letterSpacing: 1),
                        ),),
                      Text('$p2',style: TextStyle(color: Colors.white,letterSpacing: 1),),
                    ],
                  ),
                ),
              ),
              Container(
                padding: EdgeInsets.only(left: 10),
                height: 25,
                width: 60,
                decoration: BoxDecoration(
                  color: Colors.green,
                  borderRadius: BorderRadius.only(
                      topLeft: Radius.circular(20),
                      bottomRight: Radius.circular(4)),
                ),
                child: Center(
                  child: Row(
                    children: [
                      Text('$rat2',style: TextStyle(color: Colors.white),),
                      Icon(Icons.star,color: Colors.white,),
                    ],
                  ),
                ),
              )
            ],
          ),
        ),
        flex: 1,
      ),
      SizedBox(width: 15,),

    ],
  ),
),
flex: 1,
);
}
void main() {
  SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
  statusBarColor: Colors.white,
  systemNavigationBarColor: Colors.white,
  //statusBarBrightness: Brightness.light,
  statusBarIconBrightness: Brightness.dark,
  systemNavigationBarIconBrightness: Brightness.dark,
));
[![Fashion Image][1]][1]  
runApp(
MaterialApp(
  home: Scaffold(
    appBar: AppBar(
      title: Text(
        'SHOPPING GALLERY UI',
        style:
            TextStyle(letterSpacing: 2, color: Colors.black, fontSize: 20),
      ),
      centerTitle: true,
      backgroundColor: Colors.white,
      brightness: Brightness.light,

    ),
    body: SingleChildScrollView(
      child: Container(
        height: 1200,
        child: Stack(
          children: [
            Container(
              width: double.infinity,
              height: double.infinity,
              decoration: BoxDecoration(
                gradient: LinearGradient(
                  colors: [
                    Color(0xff357cea),
                    Color(0xff4c53ea),
                    Color(0xff9c2bdd),
                    Color(0xffca02e5),
                  ],
                  begin: Alignment.topCenter,
                  end: Alignment.bottomCenter,
                ),
              ),
            ),
            Container(
              margin: EdgeInsets.only(bottom: 20),
              child: Column(
                children: [

                  getData('assets/images/shoes.png','assets/images/tshirt.jpg','SHOES','TSHIRT','5.0','4.1','\$30.33  ','\$52.00  '),
                  getData('assets/images/gtop.jpg','assets/images/blazer.jpg','TOP','BLAZER','4.9','4.2','\$40.00  ','\$99.99  '),
                  getData('assets/images/hoodie.jpg','assets/images/jeans.jpg','HODIE','JEANS','4.7','4.5','\$70.00  ','\$72.30  '),
                  getData('assets/images/combo.jpg','assets/images/jacket.jpg','COMBO','JACKET','4.8','4.8','\$56.27  ','\$60.90  '),
                  getData('assets/images/shrug.jpg','assets/images/hot.jpg','SHRUG','HOT WEAR','4.2','4.1','\$90.99  ','\$54.90  '),
                  getData('assets/images/watch.jpg','assets/images/shirt.jpg','WATCH','SHIRT','4.3','4.0','\$99.99  ','\$25.33  '),

                ],
              ),
            ),
          ],
        ),
      ),
    ),
  ),
      debugShowCheckedModeBanner: false,
),
);