Forum

Letters jumping in Skia text animation

The letters are jumping around slightly if the words in Skia renderer are rotated (probably when scaled as well). I could be entirely wrong but is this a hinting issue? Is it possible to disable hinting?

skia_letters_jumping.vl (14.1 KB)

Thanks.

@tonfilm since you recommended Skia in this thread, do you have an idea?

How can other SkiaPaint properties be set, like FHintingLevel or FIsAutoHinted? Is this functionality not available yet?

A lot of the properties are null:
image

hi jerry, @gregsn or @robotanton might have a better idea about that. i think the paint only contains the changed properties and gets merged with a default paint before it gets drawn.

what i remember from earlier days is that it’s good to quantize the position of the text to whole pixel coordinates. that is 0.01 units in vl.skia. the Quantize node can do that for you. also the text size should match with the pixels, which means no scaling should be applied to the letters.

Hi jerry,

yes, the HintingLevel property is not exposed at the moment.
I’ve just tried different settings for this property, as stated here (https://skia.org/user/api/SkPaint_Reference#SkPaint_setHinting). None of them helps against jumping letters. So there is something else.

Best,
Anton

Hi jerry,

I’ve investigated a bit in rotating the text.
I guess the solution is to draw the text on path and rotate the path.
Nothing jumps. Please check the patch attached.

Best,
Anton

skia_letters_jumping-NotJumpingOnPath.vl (17.2 KB)

1 Like

Thanks a lot, @robotanton. It works and I highly appreciate it.

I would call it workaround rather than solution though.

this seems to be the correct way to draw rotated text with skia, just something we have to learn. for other objects transformations don’t seem to cause drawing problems. text is always a bit special. but i am amazed by the text drawing quality… did you know that whenever you look at an android phone or chrome that you look at Skia drawings? ;)

Yeah, the quality is great. But it doesn’t only happen for rotations but also for scaling or translating text.

Does the Skia API suggest that?

Hello,

i’ve posted our troubles to skiasharp.
It turned out there was a problem on their side, but it is fixed in the upcoming release.

Best,
Anton

5 Likes

@robotanton: Thanks a lot!

Hello @jerry,

we’ve updated our Skia to the latest SkiaSharp 1.68.
The letters are still jumping a bit when the text is rotating, but look much better.
SubpixelText is now on by default. Still, drawing text on path and transforming the path or the layer produces the smoothest results.
Will bump this issue again at SkiaSharp.

VL.Skia pack is included in the latest Alphas by default, no need to download the nuget.

Best,
Anton

2 Likes

Hi. I’m having similar issues with lines of text jumping when translated.
I’m translating multi-line text through “BreakAtWidth”. Slow translations gives me very bad jumping of individual lines. Rendering the lines on a path as previously suggested doesn’t work in that case because it doesn’t work with the “BreakAtWidth” as far as I can see.
To test just open the “Text-BreakAtWidth” helppatch and connect an LFO with a period of 20s to the Y-Position of the Text.

I sorrily can’t reproduce this here.
Had a look at both patches.
However, nowadays you can set the hinting level. I played with it and then was able to find a setting where I got jumping letters. Try it with node SetHintingLevel (advanced).