How do I text wrap with flutter text widget?
175
you have to wrap your text into a SizedBox and then you can also set multiple lines by editing the maxLines property of the Text widget:
Example:
SizedBox(
//You can define in as your screen's size width,
//or you can choose a double
//ex:
//width: 100,
width: MediaQuery.of(context).size.width, //this is the total width of your screen
child: Text(
widget.p.description,
style: TextStyle(
fontWeight: FontWeight.w800,
),
overflow: TextOverflow.ellipsis,
),
);
Also you can define how many lines the text should be as you can see below:
SizedBox(
//You can define in as your screen's size width,
//or you can choose a double
//ex:
//width: 100,
width: MediaQuery.of(context).size.width, //this is the total width of your screen
child: Text(
widget.p.description,
maxLines: 5,
style: TextStyle(
fontWeight: FontWeight.w800,
),
overflow: TextOverflow.ellipsis,
),
);
Comments
-
Spider over 1 year
I have a
RenderFlex overflowed by 72 pixels on the right issue
Caused by the first Text() widget, when users have really long texts. I even tried to use Textoverflow, but that didn't do anything either.
So I tried to wrap it with a Flexible as suggested here Flutter- wrapping text however it's not working. Any idea what I'm doing wrong?
Column( mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( widget.p.description, style: TextStyle( fontWeight: FontWeight.w800, ), overflow: TextOverflow.ellipsis, ), SizedBox(height: 4.0), Row( children: [ Text( timeago.format(widget.p.timestamp.toDate()), style: TextStyle(), ), SizedBox(width: 3.0), StreamBuilder( stream: lRef .where('pId', isEqualTo: widget.p.pId) .snapshots(), builder: (context, AsyncSnapshot<QuerySnapshot> snapshot) { if (snapshot.hasData) { QuerySnapshot snap = snapshot.data; List<DocumentSnapshot> docs = snap.docs; return buildCount(context, docs?.length ?? 0); } else { return buildCount1(context, 0); } }, ), ], ), ], ),
-
Spider about 2 yearsOh perfect, this works. Thanks!