Support emojis - Githubissues

oliverpool commented 3 years ago

I would like to render emojis embedded in the text.

I have made a proof-of-concept that works like this:

get the emojis as png from https://twemoji.twitter.com/ (they are also available as svg, but rendering svg is not trivial)
make a list of all supported emojis (by converting the hex-name of the icons to the string of the emoji : 1f3c3-200d-2640-fe0f.png => 🏃‍♀️)
give a function as a parameter to RichText to recognize the supported emojis from the input text (in RichText.Add)
return the emojis with their coordinates from RichText.ToText (and replace its text with "" to prevent being it renderer as text)
Get the associated png file from the filesystem and draw it as an image on the context.
Example (ignore the strange newlines):

Since the emoji influence the position of the letters (computed in RichText), this requires a modification of the core (and Text has unexported fields, so a 3-rd party package can't work).

However the rendering of the emojis does not have to be in the core (only the identification of the "supported emojis" must be integrated) - so no dependency on twemoji.

Would you consider such an addition to the library or do you think that this is way out of scope? I can show you in a draft PR if you want to take a closer look at the modifications that I made.

Background: I am using this project for a small german startup (https://www.bilderbrief.de/) and my customers would :heart: to send emojis :wink:

tdewolff commented 3 years ago

Hey @oliverpool , that is a great idea! There are two separate things that come to my mind:

We should support inline images and paths in RichText
We should support SVG glyphs in SFNT fonts (this is where fonts keep their emoticons, see https://docs.microsoft.com/en-us/typography/opentype/spec/svg), however I'm not sure which fonts have them defined and which don't. Surely, you can load a font that has emoticons and add text runs to the RichText with that font (you can combine fonts in RichText)

Both should happen at some point, but the first is far more useful and versatile and can in the meantime be an alternative for the second. Parsing SVGs in SFNT fonts is a lot of work.

However, Text and RichText are being completely revamped in the next release, see the develop branch for a status on that. It has the following implemented: parsing SFNT fonts (TTF, OTF, WOFF, WOFF2, EOT), subsetting SFNT fonts, text shaping using HarfBuzz (ligatures, accents for Devanagari), text direction using FriBidi (combine arabic with latin), vertical text (Chinese, Japanese, ...), font features and variants (ligature and stylistic variants), text justification using Donald Knuth's algorithm as used in TeX, and some other bits. This is working for all output files (SVG, PDF, PNG, ...), however only the NewTextLine is implemented and not yet the RichText interface. The latter should not be a big piece of work though. The Text structure is greatly simplified. Please take a look at the branch to see the results, but adding emoticons would need a bit more work (not much) as well, and realistically that branch might get merged in a month of two.

If you want emoticon support soon, I suggest you create your own branch for now, or wait for the new branch to be merged. You could also push to master now, but there's little gain as the new branch will merge over your changes!

oliverpool commented 3 years ago

All right, I will maintain my own branch for now (https://github.com/tdewolff/canvas/compare/master...oliverpool:bilderbrief)

Feel free to ping me when the develop branch is finalized, so that I can check if everything still works fine for my usecases and look how I can integrate the emojis back (no hurry - it works fine for now :)

tdewolff commented 3 years ago

I've incorporated this issue in the new roadmap from where it will be tracked: #74

weizhongtan commented 1 year ago

I'm interested in using this package (which is awesome by the way!) for rendering emojis inline with text and came across this issue where it seems that the groundwork has already been started to support this. Is there any appetite to get the changes merged into the upstream? Thanks

tdewolff commented 1 year ago

Hi Wei, this has already been merged and you can insert images or any "canvas" online with text, please see the documentation of the RichText struct ;-)

On Fri, Sep 1, 2023, 20:32 Wei Zhong Tan @.***> wrote:

I'm interested in using this package (which is awesome by the way!) for rendering emojis inline with text and came across this issue where it seems that the groundwork has already been started to support this. Is there any appetite to get the changes merged into the upstream? Thanks

— Reply to this email directly, view it on GitHub https://github.com/tdewolff/canvas/issues/73#issuecomment-1703172284, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABKOGHT2SVX3RILAJWU55OTXYIS33ANCNFSM4XNDQC6A . You are receiving this because you modified the open/close state.Message ID: @.***>

tdewolff commented 1 year ago

For your information, see https://github.com/tdewolff/canvas/wiki/Fonts-&-Text#images-paths-and-formulas-between-text

On Sat, Sep 2, 2023, 07:52 Taco de Wolff @.***> wrote:

Hi Wei, this has already been merged and you can insert images or any "canvas" online with text, please see the documentation of the RichText struct ;-)

On Fri, Sep 1, 2023, 20:32 Wei Zhong Tan @.***> wrote:

I'm interested in using this package (which is awesome by the way!) for rendering emojis inline with text and came across this issue where it seems that the groundwork has already been started to support this. Is there any appetite to get the changes merged into the upstream? Thanks

— Reply to this email directly, view it on GitHub https://github.com/tdewolff/canvas/issues/73#issuecomment-1703172284, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABKOGHT2SVX3RILAJWU55OTXYIS33ANCNFSM4XNDQC6A . You are receiving this because you modified the open/close state.Message ID: @.***>

tdewolff / canvas

Support emojis #73