How can I a dynamic long text with another widget (like a button) Expanded in a row like this:
I try Expanded
, Flexible
and Warp
and I did not reach a conclusion.
! attention to I doesn't want this to be in a Stack
or use Padding
from the bottom! cause this text to have will change and its length may be bigger or shorter.
UPDATE : I try to use ExtendedText, but the child of TextOverFlowWidget doesn't show for me. my code:
Container(
color: Colors.amber,
height: 70,
child: ExtendedText(
'bbbbb ${toPhoneStyle(widget.inputPhone)} (${widget.selectedCountry.dialCode}) aaaaaa aaaaaaaaaaa',
overflowWidget: TextOverflowWidget(
// maxHeight: double.infinity,
// align: TextOverflowAlign.right,
// fixedOffset: Offset.zero,
child: Container(
width: 60,
height: 60,
color: Colors.red,
),
),
),
),
But if miniaturize height of Container like height:20
, show like this:
Try this: Extended text package
There is an overflow widget you can use.
Check their example:
ExtendedText(...
overFlowWidget:
TextOverflowWidget(
//maxHeight: double.infinity,
//align: TextOverflowAlign.right,
//fixedOffset: Offset.zero,
child: Row(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
const Text('\u2026 '),
RaisedButton(
child: const Text('more'),
onPressed: () {
launch(
'https://github.com/fluttercandies/extended_text');
},
)
],
),
),
...
)
Ok turned out that you need to specify maxLines for overflow to work properly. I think you are instead going for a widget that follows the text. You can try Text.rich() widget
Text.rich(
TextSpan(
text: 'This is an example text!',
children: [
WidgetSpan(
// Set the alignment
alignment: PlaceholderAlignment.middle,
// You can put any widget inline with text using WidgetSpan
child: Container(
margin: const EdgeInsets.only(left: 8.0),
child: ElevatedButton(
child: Text("Read more..."),
onPressed: () {},
),
),
),
],
),
);
You don't need the extended text package in this case.