Text overflow in a TextButton Flutter - flutter

Question

How do I wrap the text inside the button, I have used the overflow method in the text widget but it doesn't work. The output I got is this:
this is my code:
Widget build(BuildContext context) {
return TextButton(
onPressed: () {
_awaitValueBottomDrawer(context);
},
style: TextButton.styleFrom(
fixedSize: const Size(200, 120),
primary: Colors.white,
textStyle:TextStyle(
fontSize: 16,
),
shape: RoundedRectangleBorder(
side: BorderSide(color: Colors.transparent)
),
),
child: Row(
children: [
Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('Your Starting Location',style: TextStyle(fontWeight: FontWeight.bold)),
Text(address,overflow: TextOverflow.fade)
],
),
Padding(
padding: const EdgeInsets.all(5.0),
child: Icon(Icons.arrow_drop_down,color: Colors.white,),
)
],
),
);
}
please help

Answer 1

You need to wrap Column widget with Expanded to handle text overflow error set with maxLines property value 1
Widget build(BuildContext context) {
return TextButton(
onPressed: () {
_awaitValueBottomDrawer(context);
},
style: TextButton.styleFrom(
foregroundColor: Colors.white,
fixedSize: const Size(200, 120),
textStyle: const TextStyle(
fontSize: 16,
),
shape: const RoundedRectangleBorder(
side: BorderSide(color: Colors.transparent)),
),
child: Row(
children: [
Expanded(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: const [
Text(
'Your Starting Location',
style: TextStyle(fontWeight: FontWeight.bold),
maxLines: 1,
),
Text(
address,
overflow: TextOverflow.fade,
// overflow: TextOverflow.ellipsis
maxLines: 1,
)
],
),
),
const Padding(
padding: EdgeInsets.all(5.0),
child: Icon(
Icons.arrow_drop_down,
color: Colors.white,
),
)
],
),
);
}
Ouput: with TextOverflow.fade
Ouput: with TextOverflow.ellipsis