How to achieve Listview design on flutter - flutter

Question

I want to create a listview item design something like
Click here
and which I have tried so far is Click here
Here is my code
ListTile(
leading: ConstrainedBox(
constraints: BoxConstraints(
minWidth: 44,
minHeight: 44,
maxWidth: 64,
maxHeight: 64,
),
child: Image.network(catData[index]['icon'].toString(),
width: 150,
height: 150,
fit: BoxFit.cover,
headers: headersMap,
)
),
title: Padding(
padding: EdgeInsets.only(left: 10,bottom: 5, right: 10, top: 10),
child: Text(
getCategoryName(catData, index),
style: TextStyle(
fontWeight: FontWeight.w500,
fontSize: 20,
fontFamily: 'Mada-Medium',
letterSpacing: 0.25,
),
maxLines: 3,
overflow: TextOverflow.ellipsis,
),
),
subtitle: Padding(
padding: EdgeInsets.only(left: 10,bottom: 5, right: 10),
child: Text(
getText(catData[index]['catId'], subCatData),
style: TextStyle(
color: parseColor('##A2A2A2'),
letterSpacing: 0.25,
fontSize: 14,
fontFamily: 'Mada',
fontWeight: FontWeight.w500),
maxLines: 2,
overflow: TextOverflow.ellipsis,
)
),
)
The image portion is not setting properly on listTile title. Please help to create this design

Answer 1

Try this
class ListItem extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Container(
margin: const EdgeInsets.all(10.0),
decoration: BoxDecoration(
color: Colors.white,
border: Border.all(color: Colors.grey),
borderRadius: BorderRadius.all(Radius.circular(20.0))),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
ClipRRect(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(20.0), bottomLeft: Radius.circular(20.0)),
child: Image.asset(
'assets/images/nilesh.jpg',
fit: BoxFit.cover,
height: 120,
width: 100,
),
),
SizedBox(width: 20),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
// mainAxisAlignment: MainAxisAlignment.spaceAround,
mainAxisSize: MainAxisSize.max,
children: <Widget>[
SizedBox(height: 20),
Text(
'Dummy Text',
style: TextStyle(color: Colors.black, fontWeight: FontWeight.bold),
),
SizedBox(height: 30),
Text(
'Dummy Text',
style: TextStyle(color: Colors.grey, fontWeight: FontWeight.normal),
),
],
))
],
),
);
}
}
OUTPUT