[Flutter 3]TextPainter does not respect the height factor of text style #104153
Labels
a: typography
Text rendering, possibly libtxt
c: regression
It was better in the past than it is now
engine
flutter/engine repository. See also e: labels.
found in release: 3.0
Found to occur in 3.0
found in release: 3.1
Found to occur in 3.1
has reproducible steps
The issue has been confirmed reproducible and is ready to work on
P2
Important issues not at the top of the work list
r: fixed
Issue is closed as already fixed in a newer version
Comments
|
Issue is reproducible on flutter 3+, but not flutter 2.10.5. Leaving this for further input from the team. Steps to reproduce
videos
code sampleimport 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
double _height = 0.0;
void _incrementCounter() {
double height = _computeLineHeight();
setState(() {
_counter++;
_height = height;
});
}
double _computeLineHeight() {
TextSpan text = const TextSpan(
text: 'This is a Sample',
style: TextStyle(
fontSize: 16,
height: 20 / 16,
),
);
TextPainter painter = TextPainter(text: text, textDirection: TextDirection.ltr, textScaleFactor: 1.0);
painter.layout(maxWidth: 200);
return painter.computeLineMetrics()[0].height;
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'Current height is $_height. You have pushed the button this many times:',
),
Text(
'$_counter',
style: Theme.of(context).textTheme.headline4,
),
],
),
),
floatingActionButton: FloatingActionButton(
onPressed: _incrementCounter,
tooltip: 'Compute',
child: const Icon(Icons.height),
),
);
}
}
flutter doctor -v |
danagbemava-nc
added
c: regression
danagbemava-nc
changed the title
HansMuller
added
engine
|
The SkParagraph text renderer in Flutter 3 is using ascent/descent values in LineMetrics that have not been adjusted for the line height multiplier in TextStyle. This is different from the old Libtxt renderer and the LineMetrics spec (https://api.flutter.dev/flutter/dart-ui/LineMetrics/ascent.html) |
|
@jason-simmons mentioned in triage that the Skia fix for this has landed (or is pending). Can you please cross-reference that here? |
|
What's the status of this? |
|
This has been fixed on the Flutter master branch. |
|
I can confirm this has been fixed on the Per our triage policy, I'll be closing this issue since it has been fixed on the If anyone experiences this issue on newer versions of the master channel, kindly file a new issue. Thank you videoSimulator.Screen.Recording.-.iPhone.13.Pro.-.2022-07-29.at.06.40.17.mp4flutter doctor -v |
danagbemava-nc
added
the
r: fixed
|
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 |
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Steps to Reproduce
flutter runon the code sampleExpected results:
If the font size is 16, height is 20 / 16 and the
textScaleFactoris 1.0, the computed line height should be 20.Actual results:
The font size is 16, height is 20 / 16 and the
textScaleFactoris 1.0, the computed line height is 19.Code sample
You can get the code here.
Logs
The text was updated successfully, but these errors were encountered: