Rendering 3D fluent emojis with IDWriteTextLayout

Question

Hi Castorix31,

I tested your example **Direct2D_CScrollingText **in Win11 and also this example (https://github.com/microsoft/Windows-universal-samples/blob/main/Samples/DWriteColorGlyph).

Your example uses this code to render emojis:

pST->m_pD2DContext->DrawTextLayout(pt, pST->m_pTextLayout, pST->m_pMainBrush, D2D1_DRAW_TEXT_OPTIONS::D2D1_DRAW_TEXT_OPTIONS_NO_SNAP | D2D1_DRAW_TEXT_OPTIONS::D2D1_DRAW_TEXT_OPTIONS_ENABLE_COLOR_FONT);

DWriteColorGlyph example uses a CustomTextRenderer class and its method DrawGlyphRun to render emojis.

I see a significant difference in the result in Win11:

1. DrawTextLayout renders the 3D fluent emojis (see first picture below)
2. DrawGlyphRun renders the emojis with more details, it is also much faster than DrawTextLayout, but the emojis are plain, not the 3D fluent ones (see second picture below)

Do you know what we should do to get the 3D fluent emojis when using a CustomTextRenderer class such as in the DWriteColorGlyph example?

Hope I was able to explain this question.

Thank you very much for your help.

Answer 1

Hi Castorix,

Perhaps this is the answer:

========

Rendering Text with Pixel Snapping:

IDWriteTextLayout provides a convenient way to render text, including emoji. When using ID2D1RenderTarget::DrawTextLayout, DirectWrite automatically performs pixel snapping, resulting in clear and sharp text. However, if you’re using ID2D1RenderTarget::DrawGlyphRun to render individual glyphs (like emoji), achieving pixel snapping can be more challenging.

Challenges with DrawGlyphRun:

DrawGlyphRun operates on individual glyphs, and it doesn’t have the same built-in pixel snapping behavior as DrawTextLayout.

=======

So, it seems that DrawTextLayout performs pixel snapping and that's why it renders 3D fluent emojis. However, DrawGlypgh doesn't and that's why it renders only 2D emojis.

Is this approach right? Thank you.