How to Draw Text with Emojis?

[LingamYoni]

I'm trying to draw text with emojis using Image32, but instead of the emojis, I keep getting rectangles.

Here's what I mean:

// Example code
    DrawText(img, img.Bounds, 'Successfully compiled wishes for happiness! 🍀 Happy Holidays! - Your programmer 🖥️', taCenter, tvaBottom, fc, clBlack32);

And this is what it looks like:

Successfully compiled wishes for happiness! 🟥🟥 Happy Holidays! - Your programmer 🟥🟥🟥

Is there a specific way to draw text with emojis in Image32? Any help would be greatly appreciated! 🙏

Thanks a lot!

[tomwiel]

Implementing own rendering of color-font glyphs looks like a lot of work. Or would require FreeType or DirectWrite. Perhaps also the maintainers of https://github.com/andersmelander/PascalType2 have planned such color support?

[AngusJohnson]

Implementing own rendering of color-font glyphs looks like a lot of work.

Indeed. Not happening. Sorry to disappoint.

[andersmelander]

Perhaps also the maintainers of https://github.com/andersmelander/PascalType2 have planned such color support?

I have. But...

PascalType2 is primarily a font loader (loads and parses fonts) and a shaping engine (translates from Unicode text to font glyphs, handles ligatures, kerning and complex text such as Arabic, Thai, etc.). On top of this one can add:

• A renderer (draws glyphs using a graphics library. E.g. Image32, GDI, Graphics32). Already implemented.
• Text layout (handles word wrap, justification, etc.). Partially implemented.
• Font substitution (automatically uses another font if a glyph doesn't exist in the current font). Not implemented.

There currently exist 4 major color font formats:

• COLR
  • COLR — Color Table
  • CPAL — Color Palette Table
• CBLC/CBDT and EBDT/EBLC (used by Google Noto Color Emoji)
  • CBLC — Color Bitmap Location Table
  • CBDT — Color Bitmap Data Table
• sbix (used by Apple Color Emoji)
  • sbix — Standard Bitmap Graphics Table
• SVG (used by Twitter Color Emoji)
  • SVG — The SVG (Scalable Vector Graphics) Table

Of these I would initially only consider the COLR format; It's the most widely used and the only format supported by all major browsers. CBLC is a bitmap font format, sbix is only used by Apple and SVG is a hack. Adding support for COLR in the loader and shaper should be trivial. The hard work really is to redesign the rendering API so it can support COLR's more complex rendering algorithm (with layers, gradients, etc.).

But that's not all; In order to handle text with embedded Emojii's (as in the example), one really needs to support font substitution as the text glyphs and the Emojii glyphs in most cases are in different fonts. I'll spare you the details but this subject alone is so complex that most libraries just give up and defer the task to the host OS.

So in the end, although support for color Emoji's at first sounds like a small task, it turns out that it depends on a lot of different subsystems that also needs to be implemented first.

[andersmelander]

FYI I've now created an issue in PT2 to track this feature and begun the initial ~procrastination~ work: Support color fonts (primarily Emojis).

I expect to be able to render COLRv0 Emojis (such as those in the Segoe UI Emoji font) within a week. COLRv1 (such as Noto Color Emoji) is a whole other ballgame. The design of it is a community driven mess and it's going to be a bitch to implement.

[andersmelander]

within a week

Okay. Now I really have to get some actual work done :-)