SKIA: get text path vs. text (alignment)

vvvv gamma question
1

hi all,

whats the current solution to avoid jumping skia text? I found threads mentioning “get text path”.
This should be a fix for an older project, so I need a module that can conveniently replace all my text nodes.

image
image1064×871 41.3 KB

problem is that I use different text alignments. the horizontal one seems to work, but the vertical one just works for the “baseline” setting. I also use “break at width” a lot, and I see this still does not work for the “get tex path” node.

Any recommendations?
skiaTextAliasing.vl (23.2 KB)

2

only allowing whole pixel positions via quantize node should help. line-spacing (esp. for the vertical text) should also be pixel aligned.

3

thx for the tip! I tried and did not really see any difference.

GPT recommendet:
paint.setAntiAlias(true);
paint.setSubpixelText(true); // 1 / 64 px positioning
paint.setLinearText(true); // linear metrics
paint.setHinting(SkFontHinting::kNone); // no integer rounding

tried setting those flags, no difference as well.

this is my solution. bit hacky, but this is as bad as it gets. works for different alignements, font sizes, lineheight etc.

image
image2235×1004 278 KB

4

did you do a F9 after changing those settings? I made use of them in VL.RichTextKit and iirc they had an effect. the defaults in rtk should be smth like the above. not sure about the defaults in VL.Skia though.

5

I gave those settings another try with F9, but for me it did not make a noticeable change.

I also noticed an error where some lines get unsharp when using “get text path”.
already tried quantizing and moving their baselines to full pixel values, but no change.
this is the only bummer when using this solution.

thing is they get unsharp one by one, and then when they are much smaller they start getting sharp again. also different behaviour when using caps or lower.

textpath

6

Hi, 5 cents here, I think you trying to solve unsolvable problem, the thing is if you look on ui frameworks, they tend to use predefined font size per screen resolution, e.g. screen size < 1280 font size 14px, from 1280 to 1920 font size 16px. There is no such thing a scalable fonts in UI, basically the gif above is illustrating something that is against UI rules. All the UI should be scaled based on breakpoints e.g. resolution X dpi = pixels final resolution (density).

The thing is, it’s only top level of iceberg, since there are fonts, that tend to work only on certain sizes, sadly can’t find an example… But if you try to put incorrect size in there you will get artifacts straight away… How ever it might look good in something like illustrator and maybe figma…

The point is your font can’t scale on fractions, it should be an exact pixel size, and if you want do something like above, you need rounding at list to make it look sharp.

7

hey, thanks for your input and the background info!
long story short, I do not want to scale; I was just wondering why the path workaround does not produce the same results for each line.

8

I think it’s because there is somewhere double somewhere float or some other type of optimisation like when you sample it does it on cpu vs when it draw it offloads to gpu or something more optimised for render… But only guesses possible without studying source code…