How to get stable layout when zooming text with CanvasKit?

Skip to first unread message

Yifeng Wang

May 26, 2021, 1:05:11 AMMay 26
to skia-discuss
Hi, I'm using CanvasKit to render multi-line text. When user performs zooming, the text width and font size are scaled together. But in this case, the layout result is unstable, jumps in line height or line break can be observed. See online fiddle:

Is this behavior expected (I filed an issue at but not sure if it's a bug)? Text scaling in browser doesn't have this issue, can we achieve similar result with some workaround? Thanks.

Yifeng Wang

Shachar Langbeheim

May 26, 2021, 3:22:01 AMMay 26
to skia-discuss
You can convert the text to a SkPath at a constant font size, and then scale the path. 
See this discussion:

You received this message because you are subscribed to the Google Groups "skia-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to
To view this discussion on the web visit

Mike Reed

May 26, 2021, 7:02:05 AMMay 26
Very nice test case!

Skia has settings (on the SkFont) that can smooth this out, but we may not have exposed them all to CanvasKit yet.

Have you tried font.setSubpixel(true) or font.setLinearMetrics(true) ?

We also have a baseline_snap setting which is not exposed. It may be needed to fixed the vertical snapping...

Ben Wagner

May 26, 2021, 10:23:42 AMMay 26
Also "font.setHinting(CanvasKit.FontHinting.None);". Though "Slight"
should also work (it tends to hint in only the vertical direction). If
hinting is Normal or Full then hinting will happen, which expressly
trades off outline scalability for legibility.
> To view this discussion on the web visit
Reply all
Reply to author
0 new messages