How i can make NetworkImage in Container?

308 Views Asked by At

How can I make my NetworkImage Fit in a Card In another Container?

I have tried to add BoxFit.fitHeight but height is not set, width is working fine but height not working.

I have making a CardView in Listview.builder and I want to my image height fit to leftside of my card with some width and how can I make it fit to height of the in the Container Card in which another Card is Working

Container(
  height: MediaQuery.of(context).size.height*.20,
  child: Card(
    shape: RoundedRectangleBorder(
      borderRadius: BorderRadius.circular(15),
    ),
    elevation: 5,
    child: TextButton(
      onPressed: () {
        Navigator.push(context, MaterialPageRoute(builder: (context) => ViewDonation(donation: donation,),));
      },
      child: Row(
        mainAxisAlignment: MainAxisAlignment.start,
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: [

          Container(

            height: MediaQuery.of(context).size.height*.26,
            width: MediaQuery.of(context).size.height*.26,
            decoration: BoxDecoration(
                borderRadius:BorderRadius.only(
                  bottomLeft: Radius.circular(15) ,
                  topLeft: Radius.circular(15) ,
                  bottomRight: Radius.circular(15) ,
                  topRight: Radius.circular(15) ,
                ),
                /*    boxShadow: [
                   BoxShadow(
                      color: Colors.grey.withOpacity(0.8),
                      spreadRadius: 2,
                      blurRadius: 1, // changes position of shadow
                    ),
                  ],*/
                image: DecorationImage(
                    image:  NetworkImage("https://emedz.net/images/doctors/20210213_163233.jpg"),
                    fit: BoxFit.cover,
                )
            ),
          ),
         SizedBox(width: MediaQuery.of(context).size.width* .04,),
         Column(
           mainAxisAlignment: MainAxisAlignment.start,
           crossAxisAlignment: CrossAxisAlignment.start,
           children: [

             Expanded(child: Text(donation.title,style: TextStyle( fontSize: 14, fontWeight: FontWeight.bold, color: AppColor.primary),)),
             Center(child: Text(donation.contact,style: TextStyle( fontSize: 10),)),
             Row(

               children: [

                 Text('Rs. '+donation.amountRequired+'/-',style: TextStyle( fontSize: 10, color: AppColor.primary ),),
                 SizedBox(width: 5,),
               ],
             ),
             Center(child: Text('Required till: '+donation?.dueDate??"",style: TextStyle( fontSize: 10),)),

           ],
         ),
        EdgeInsets.zero,),onPressed: () {
         //      //   Navigator.push(context, MaterialPageRoute(builder: (context) => ViewDonation(donation: donation,),));

        ],
      ),
    ),
  ),
),

My Problem is that Height not fit to Card

1

There are 1 best solutions below

0
On

according to your image ration you can use below widget, for eg. suppose your image Resolution is 1000*500 then go for ration like 1/2

    AspectRatio(
      aspectRatio: 16 / 9,
      child:NetworkImage("https://emedz.net/images/doctors/20210213_163233.jpg"),          
    ),