-
Notifications
You must be signed in to change notification settings - Fork 29.7k
Description
Steps to reproduce
Draw text using the Lato font on Flutter 3.16 with Impeller enabled
Expected results
The kerning of the text is correct.
Actual results
The kerning of the text looks incorrect.
It seems like the issue is more noticeable on some devices than others and worse for specific fonts/sizes/weights.
The code sample below replicates some particularly bad cases we ran into in our app. The screenshots were taken on an iPhone XR simulator because the issue was very noticeable on it.
I found #127815 which mentions minor letter spacing differences with Impeller, but this case looks a lot worse and the issue is only introduced in Flutter 3.16.
Code sample
Code sample
This uses the google_fonts package.
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
final lato = GoogleFonts.lato(fontSize: 15, color: Colors.black);
final latoBold = lato.copyWith(fontWeight: FontWeight.bold);
return MaterialApp(
home: Container(
color: Colors.white,
child: DefaultTextStyle(
style: lato,
child: Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text('Injecteer', style: latoBold),
const Text('We vergelijken'),
const Text('vergelijken'),
Text('Het gas', style: latoBold),
const SizedBox(height: 12),
Text('The quick brown fox jumps over the lazy dog',
style: latoBold),
Text(
'A mad boxer shot a quick, gloved jab to\nthe jaw of his dizzy opponent.',
style: latoBold),
],
),
),
),
),
);
}
}
Screenshots or Video
Screenshots / Video demonstration
| Flutter 3.13 (Impeller) ✅ | Flutter 3.16 (No Impeller) ✅ | Flutter 3.16 (Impeller) ❌ |
|---|---|---|
![]() |
![]() |
![]() |
Here's a GIF cycling through in the order above. The frame it shows longer is the 3.16 Impeller one. All three are different, but only the scrot from 3.16 with Impeller looks very noticeably wrong.
Logs
No response
Flutter Doctor output
Doctor output
impeller_kerning_bug> fvm flutter doctor -v
[!] Flutter (Channel stable, 3.16.3, on macOS 14.0 23A344 darwin-arm64, locale en-BE)
• Flutter version 3.16.3 on channel stable at [...]/fvm/versions/3.16.3
! Warning: `flutter` on your path resolves to [...]/flutter/bin/flutter, which is not inside your current Flutter SDK checkout at [...]/fvm/versions/3.16.3. Consider adding [...]/fvm/versions/3.16.3/bin to the front of your path.
! Warning: `dart` on your path resolves to [...]/flutter/bin/dart, which is not inside your current Flutter SDK checkout at
[...]/fvm/versions/3.16.3. Consider adding [...]/fvm/versions/3.16.3/bin to the front of your path.
• Upstream repository https://github.com/flutter/flutter.git
• Framework revision b0366e0a3f (2 weeks ago), 2023-12-05 19:46:39 -0800
• Engine revision 54a7145303
• Dart version 3.2.3
• DevTools version 2.28.4
• If those were intentional, you can disregard the above warnings; however it is recommended to use "git" directly to perform update checks and upgrades.
[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
• Android SDK at [...]/Library/Android/sdk
• Platform android-34, build-tools 34.0.0
• Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
• Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231)
• All Android licenses accepted.
[✓] Xcode - develop for iOS and macOS (Xcode 15.1)
• Xcode at /Applications/Xcode-13.4.1.app/Contents/Developer
• Build 15C65
• CocoaPods version 1.13.0
[✓] Chrome - develop for the web
• Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome
[✓] Android Studio (version 2022.3)
• Android Studio at /Applications/Android Studio.app/Contents
• Flutter plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/9212-flutter
• Dart plugin can be installed from:
🔨 https://plugins.jetbrains.com/plugin/6351-dart
• Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b829.9-10027231)
[✓] VS Code (version 1.85.1)
• VS Code at /Applications/Visual Studio Code.app/Contents
• Flutter extension version 3.78.0
[✓] Connected device (4 available)
• [...]
[✓] Network resources
• All expected network resources are available.
! Doctor found issues in 1 categoryMetadata
Metadata
Assignees
Labels
Type
Projects
Status



