0

I am rendering emoji in SkiaSharp and have been able to get it to work correctly for simple emoji (like or ) but not more complex emoji (like or ‍).

The trickiest part was setting the correct typeface containing the emoji since there is no support for fallback fonts as noted here: https://github.com/mono/SkiaSharp/issues/232

Here is a simplified version of the code I am using:

int GrinningFaceEmoji = 0x1f600;

void DrawEmoji(SKCanvas canvas, string emoji, int x, int y) {

    SKPaint paint = new SKPaint();
    paint.Typeface = SKFontManager.CreateDefault().MatchCharacter(GrinningFaceEmoji);

    canvas.DrawText(emoji, x, y, vtsm.paint);
}

When emoji is a simple emoji, it works perfectly, but more complex emoji show up as multiple-characters. The light baby shows as two characters - the yellow baby followed by a color square. The artist shows as three characters. I am currently testing this on macOS.

Harlan
  • 141
  • 8
  • 1
    Canvas DrawText is almost unusable directly in real world. If you want to localize app to other languages, like arabic o hebrew, you have to use text shaping. Try to SkiaSharp HarfBuzz and use extension DrawShapedText if it helps. – Michal Dobrodenka Jan 11 '19 at 06:10
  • Hi Michal. Yes, have done a lot of work to make DrawText work, switching fonts as needed, etcetera. Are you using [SkiaSharp.Harfbuzz](https://learn.microsoft.com/en-us/dotnet/api/skiasharp.harfbuzz)? I couldn't find a way to measure text in this API. Also, do you know if DrawShapedText would actually render the emoji correctly? Finally, do you have any idea of the performance overhead imposed by DrawShapedText vs DrawText? Thanks for your input. – Harlan Jan 12 '19 at 01:46
  • Yes, I'm using SkiaSharp.HarfBuzz. I had my app ready when we sent demo to our Israeli partner and everything was broken. Then I realized, that there is probably no place in the app where I can draw text without Harfbuzz. It took me some time to implement text drawing correctly - RTL, LTR & combinations, including numbers etc. Harfbuzz solves only text shaping - super important in some languages, if text start with LTR whole text is treated like LTR - you must split it to segments and position them. Neither harfbuzz help with font fallback. – Michal Dobrodenka Jan 13 '19 at 06:26
  • To your questions, performance of text rendering is not an issue in my app and I do a lot of things to draw text (see above) . Font fallback must be implemented manually :( - I used shortcut and compiled my own font which includes all requested characters. I don't know if your emoji will work, but if it is from one font file, it could. – Michal Dobrodenka Jan 13 '19 at 06:26
  • I just found this [SO about emoji and HarfBuzz](https://stackoverflow.com/questions/50720755/emoji-modifiers-zwj-sequences-using-harfbuzz-freetype-in-apple-color-emoji), which seems to indicate that HarfBuzz will indeed render the characters correctly. I'll give it a try... – Harlan Jan 13 '19 at 06:43
  • I've gone through the pain of font fallback already. RTL I may just put off for the moment. Thanks for sharing your experience Michal. – Harlan Jan 13 '19 at 06:45
  • FYI, tried SkiaSharp.HarfBuzz 1.68.0 on macOS and it does not render multi character emoji properly either. Output from DrawShapedText is the same as the standard DrawText. – Harlan Feb 13 '19 at 02:37
  • Then you probably need fallback and emoji font. – Michal Dobrodenka Feb 13 '19 at 10:59
  • Update: As of SkiaSharp 2.80.2, HarfBuzz on Windows and macOS does render emoji with skin tone modifiers correctly (). It still doesn't render ‍ correctly unfortunately. – Harlan Mar 18 '21 at 03:15

0 Answers0