I am using RichText
and in this
text justify is not working correctly with RichText
when using any of text span with style decoration: TextDecoration.underline
RichText(
softWrap: true,
textAlign: TextAlign.justify,
text: TextSpan(
style: TextStyle(
color: Colors.black,
fontWeight: FontWeight.w500,
fontSize: 16.0,
),
children: getSpan(),
),
)
List<TextSpan> getSpan() {
List<TextSpan> spans = List<TextSpan>();
spans.add(TextSpan(
text:
"And thus We made them rise ",
));
spans.add(
TextSpan(
text: " they ",
style: TextStyle(
decoration: TextDecoration.underline,
),
recognizer: TapGestureRecognizer()
..onTap = () {
print("click on me");
}),
);
spans.add(TextSpan(
text:
" And thus We made them rise ",
));
return spans;
}
The text-justify property in CSS is a companion to the text-align property that is used to set the justification method of text when text-align is set to the justify value.
text-align: justify shouldn't be used in browsers at the moment. They aren't good at handling the minute details within and the output ends up containing lots of rivers and there's no support for hyphenation (other than soft hyphens).
Flutter – Center Align Text in Text Widget To center align the text in a Text widget, provide textAlign property with value TextAlign. center .
1) Find the length of your richtextbox (rtb_Length) and lengh of text (text_Length). 2) IF text_Length > rtb_Length, Subtract the diff = rtb_Length - text_Length. [This will give you how many space is blank]. 3) If you want to Justify RIGHT, then add spaces of diff value in the begining of text, else to the end of text.
2) IF text_Length > rtb_Length, Subtract the diff = rtb_Length - text_Length. [This will give you how many space is blank]. 3) If you want to Justify RIGHT, then add spaces of diff value in the begining of text, else to the end of text. So if rtb_Length = 20, text_Length = 13, then diff = 7.
You can align to the right with the text editor properties but not to set it to be like that by default and It is Important to the Users. I have noticed that when pressing the Enter key to create a new line the space between the lines is very large.
It looks like a nasty effect of textAlign
property when set to TextAlign.justify
.
RichText(
softWrap: true,
//textAlign: TextAlign.justify,
text: TextSpan(
style: TextStyle(
color: Colors.black,
fontWeight: FontWeight.w500,
fontSize: 16.0,
),
children: getSpan(),
),
)
Updated to 21/03/19
The bug it is now fixed and at the moment (21/03/19) it is available in the master flutter channel:
flutter channel master
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With