New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Implement full support for variable fonts #109308
Comments
For optical size, the obvious thing to do would be to default to the ambient font size. But does that always work? e.g. if the font size is 5, and the variable font only supports optical sizes 20 to 48, will it clamp the value to 20 or behave in unexpected ways? |
@guidezpl it should clamp in the way you describe, and the opsz axis units should match the px units that the font-size resolves to. I'll email you privately with some additional insights into this. |
see also this: #136779 |
and right now if you include a variable font, things like material 3 textThemes which set weights (e.g. reproScaffold(
body: Center(
child: Row(mainAxisSize: MainAxisSize.min, children: [
Text(
"a",
style: Theme.of(context).textTheme.titleMedium,
),
Text(
"a",
style: Theme.of(context).textTheme.titleMedium!.copyWith(
fontVariations: [const FontVariation('wght', 500)],
),
)
]),
),
); fonts:
- family: Gabarito
fonts:
- asset: assets/fonts/Gabarito[wght].ttf (variable font: Gabarito) |
Interesting report, thanks. So even within the Flutter tree, the Material implementation is using the TextStyle API in a way that gives wrong results with a variable-weight font. That seems like further evidence that it'd be appropriate to adjust that API as part of fixing the problem. The strategy I describe at #136779 (comment) would fix this by letting |
I've filed #148026 for the proposal I laid out in that linked other issue at #136779 (comment), namely unifying into a single font-weight axis, like what browsers offer via CSS. That would resolve the symptom @wildsylvan reported above with Flutter's Material implementation. |
Breaking this out of a comment by @davelab6 . Flutter now support variable fonts on all platforms (web canvaskit soon), this issue is about improving support to aid in the developer experience.
So, to implement full support for variable fonts, I recommend Flutter have those 4 things:
opsz
axis exists in a font, set the value to the font size, and allow a ratio override, plus override via the above axis value sette. (Ideally the auto value is resolved to physical Points, 1/72nd of an inch, although I am recommending that ideal as a partisan and recognize there are other positions on what value to use; but the key idea is that it is set based on font size)Originally posted by @davelab6 in #33709 (comment)
and the following comment:
Related issues: #33709
See go/default-opsz.
The text was updated successfully, but these errors were encountered: