How can I render colored glyphs from "Segoe UI Emoji" with freetype?

Question

I'm trying to render the colored glyphs from the Windows "Segoe UI Emoji"-Font with the latest freetype 2.8.1 (I compiled the x64 debug version from the source code without single- or multithreaded) and OpenGL. So I use the seguiemj.ttf from the Windows\Fonts directory (SHA256 = d67717a6fe84e21bc580443add16ec920e6988ca067041d0461c641f75074a8c), but FT_HAS_COLOR always returns false. I also tried it with the EmojiOneColor-SVGinOT.ttf by eosrei from github, which results in the same behaviour.

When using this file for android, FT_HAS_COLOR returns true and the bitmap slot doesn't gets filled anyway.

FT_Library library;
FT_Face face;

FT_Init_FreeType(&library);
FT_New_Face(library, "resources/fonts/seguiemj.ttf", 0, &face);

bool has_color = FT_HAS_COLOR(face);
debug(LOG_INFO, 0, "font has colors: %s", has_color ? "yes" : "no");

std::u32string s = U"😀 😬 😁 😂 😃 😄 😅 😆";

FT_GlyphSlot slot = face->glyph;
for (auto c : s)
{
   int glyph_index = FT_Get_Char_Index(face, c);

   FT_Error error = FT_Load_Glyph(face, glyph_index, FT_LOAD_DEFAULT|FT_LOAD_COLOR);
   if (error)
       continue;

   error = FT_Render_Glyph(slot, FT_RENDER_MODE_NORMAL);
   if (error)
       continue;

   if (slot->bitmap.pixel_mode == FT_PIXEL_MODE_BGRA)
       debug(LOG_INFO, 0, "glyph is colored");

   ...
}

Basically I use the above code, that is only able to receive the monochrome bitmap of that font files and the pixel mode is always FT_PIXEL_MODE_GRAY.

Emojis in Word/Firefox

Emojis in my applicaton

Is there something to fix that or did I something wrong?

Belkisbelknap

Edit in a minimal reproducible example. Also, linkify the Github font & edit in the md5sum/sha256 of the Microsoft font you tried. – Nestle

Is face−>glyph−>format set to FT_GLYPH_FORMAT_BITMAP after the FT_Load_Glyph() call? – Nestle

It's set to FT_GLYPH_FORMAT_OUTLINE with both fonts. – Belkisbelknap

Hey, Do you still have all the code that generates color emojis? – Otiliaotina

Answer 1

FT_Load_Glyph with FT_LOAD_COLOR load a bitmap version of the font into the glyph slot. After that your code call FT_Render_Glyph and renders the glyph from outlines, effectively replacing the previously loaded bitmap.

You should be fine if you skip FT_Render_Glyph.

Breault

You are right. But only when I add FT_LOAD_RENDER to the FT_Load_Glyph function, then I can skip the FT_Render_Glyph call and the bitmap buffer gets filled. Maybe because there are no colors available. – Belkisbelknap

@Belkisbelknap Wait. The bitmap is not filled when running FT_Load_Glyph(..., FT_LOAD_COLOR)? Putting FT_LOAD_RENDER in there is equivalent to running FT_Render_Glyph after load which is exactly what you don´t want to do. That was my guess. If i´m wrong I´ll take back the answer – Breault

You are absolutely right. FT_Render_Glyph is only necessary when you wan't a different render mode. Using only FT_LOAD_COLOR should be right. – Belkisbelknap