Text Wrapping in Flutter - flutter

Question

I am writing a widget in flutter for a project which should look like this, I am new to flutter and I am trying to imitate the card below
So far this is my code for the widget
import 'package:flutter/material.dart';
import 'package:smooth_star_rating/smooth_star_rating.dart';
class TrailCard extends StatelessWidget {
const TrailCard({Key key}) : super(key: key);
#override
Widget build(BuildContext context) {
return Padding(
padding: const EdgeInsets.all(8.0),
child: Card(
shape:
RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),
child: InkWell(
onTap: () {},
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
ClipRRect(
borderRadius: BorderRadius.circular(20.0),
child: Image.asset(
'assets/images/cocoa.jpg',
height: 100,
width: 90,
fit: BoxFit.fitHeight,
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"Boring Cocoa",
style: TextStyle(
fontSize: 18, fontWeight: FontWeight.bold),
),
Text('Rajhamundry, AP'),
Text(
'Feel the authentic flavours of life while you visit the farms around Rajahmundry',
overflow: TextOverflow.ellipsis,
)
],
),
),
],
)),
)),
);
}
}
I tried using flexible and expanded to try and make the content look the way but I am getting overflow error

Answer 1

You can wrap the Padding widget with a Flexible widget so it takes only the amount of space needed:
NOTE: you should also set the maximum amount of lines the Text widget should take before showing the ellipsis.
Flexible(
// new line
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"Boring Cocoa",
style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
),
Text('Rajhamundry, AP'),
Text(
'Feel the authentic flavours of life while you visit the farms around Rajahmundry more text to cause overflow',
// set maximum number of lines the text should take
maxLines: 3, // new line
overflow: TextOverflow.ellipsis,
)
],
),
),
);
RESULT:

Answer 2

Wrap Padding with Expanded
Expanded(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"Boring Cocoa",
style: TextStyle(
fontSize: 18, fontWeight: FontWeight.bold),
),
Text('Rajhamundry, AP'),
Text(
'Feel the authentic flavours of life while you visit the farms around Rajahmundry',
overflow: TextOverflow.ellipsis,
)
],
),
),
)