Repository navigation
[Text] Allow for line height *between* lines on text. #47175
Description
Use case
This is the default behavior for TextViews on Android. The lineHeight param only applies between lines. This is useful, for example, when you want to increase the line height in your TextTheme. For multiple lines of text, this will increase the spacing between the lines of text. But, importantly, for single lines of text, they will remain unaffected. This means that if you have single line of text that is vertically aligned with a button or a switch, the text will not be affected (and appear off center).
Proposal
It would be nice to have API in TextStyle for specifying the lineHeight behavior. Maybe it could be an enum, something like:
enum LineHeightBehavior {
betweenLinesOnly,
aboveAndBelowLines,
...
}That way on TextStyle I could do something like
TextTheme(
body1: TextStyle(
height: 1.2,
lineHeightBehavior: LineHeightBehavior.betweenLinesOnly,
),
),.
Activity
GaryQian commentedon Dec 16, 2019
A simpler parameter may just be something like:
Of course, if there were additional enums other than these two behaviors, then an enum may make more sense. Something like this should not belong on the TextStyle though, as it is possible to have many TextStyles in a single paragraph/line/word. LibTxt and dart:ui has a concept of ParagraphStyle, which in the framework is exposed as just properties on the TextWidget itself.
johnsonmh commentedon Dec 16, 2019
The reason I think it makes sense on
TextStyleis that theheightparameter is set onTextStyle. So to me it makes sense to keep those parameters together. It also makes it much easier to use with the existingTextThemeandDefaultTextStyleAPIs if this parameter lives onTextStyle.What happens when you set multiple different
TextStyle.heightparams on a single line/word ?GaryQian commentedon Dec 17, 2019
The line will use the maximum ascent and descent.
If it were on TextStyle, we would have to disambiguate what to do when there are multiples styles on the line, one with the first line having spacing, other with first line ignoring spacing.
johnsonmh commentedon Dec 17, 2019
Ah, I see. Would we be able to make some sort of convenient API for declaring this behavior once per app? Something at the top of our app so that users wouldn't have to say
Text('foo', lineHeightBehavior: ...)every time they want to use aTextwidget?GaryQian commentedon Dec 19, 2019
The property can also be added in DefaultTextStyle which will allow all the Text widgets to be set at once.
GaryQian commentedon Dec 19, 2019
The property itself can be a maskable enum where the line spacing for different parts of the paragraph can be enabled/disabled by setting bits.
For example something like this:
111 => all spacing enabled
010 => only spacing between lines
101 => only spacing above first line and below last line
011 => disable spacing above first line
Hixie commentedon Dec 20, 2019
I hesitate to expose the 101 case unless we have a reason to support that.
GaryQian commentedon Dec 30, 2019
flutter-team-archive/engine#15087 Starts engine-side work
GaryQian commentedon Jan 10, 2020
#48346 exposes this on the framework side.
dnfield commentedon Jan 28, 2020
Reopening until this lands in framework (and because I'm reverting engine change for now).
GaryQian commentedon Jan 28, 2020
Oops, did not realize this was closed! Github autoclosed it :(
kaikai4989 commentedon Feb 6, 2020
Late to the game ... but I am wondering whether "height" is the right way to achieve line spacing in the first place because "height" is font-family-specific (each font defines its own ascent and descent to be multiplied by "height"), which means "height" becomes tricky when controlling line spacing if a line has two different fonts.
In this kind of situation, usually people would prefer StrutStyle to control the line height, with its "leading" support. Actually, line-spacing was called "leading" in old times, see https://en.wikipedia.org/wiki/Leading for details.
So I am wondering whether we should extend TextHeightBehavior to have similar opt-in for "leading", as it should be able to exclude the first line / last line as well.
github-actions commentedon Aug 23, 2021
This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of
flutter doctor -vand a minimal reproduction of the issue.