Emoji support



  • What is there involved in adding emoji support for a Qt application? Has anyone done it? Any lessons learnt?

    I see that shipping an emoji-calable font is part of a requirement, like Google Chrome does it on Windows - and adding a way to enter emoji characters is another, as native keyboards don't support them yet.

    This is only in the context of the desktop of a QWidgets application.



  • @Vadi2 said in Emoji support:

    What is there involved in adding emoji support for a Qt application?

    Nothing. QString supports unicode so emojis are supported. You might want to set the emoji font in QTextEdit to make them look better but that's it



  • To make them look relatively acceptable, yeah... plus some way for the user to actually enter them other than copy/pasting. That's what I can think of right now - if anyone actually implemented decent emoji support in their app, would love to hear your input.



  • To make them look relatively acceptable

    Just add a font that makes them look good, like Twitter's emoji (source, ttf, how to add the font)

    plus some way for the user to actually enter them

    You'll have to implement a "virtual keyboard" like a floating QTableView displaying the emoji and adding them to the text once they are clicked like most mobile apps do



  • Sounds good, thanks!



  • This does not work for me. I'm pasting 😃 into a QTextEdit - if I use the Emoji One font, it comes up black & white. If I use the Apple Color Emoji you linked above, nothing gets pasted.

    This is using Qt 5.9.3 on Ubuntu 17.04.

    Does anyone have emoji's working in Qt?


  • Moderators

    @Vadi2
    i once have implemented this. This wasn't an easy task and took quite some time.

    @Vadi2 said in Emoji support:

    This does not work for me. I'm pasting 😃 into a QTextEdit - if I use the Emoji One font, it comes up black & white

    Using fonts for emoji will always result in b/w, since font's are basically nothing more than shapes rendered in a base color. You will never receive colored emoticons using fonts.

    Here are some implementation hints:

    • i took the emoticons (16x16 PNGs) from Twitter - not all emoticon codes are covered unfortunately, but there are also other sources available for emoticons images
    • i used QTextObjectInterface class
    • i've overridden QTextEdit::createMimeDataFromSelection() to support copy of emoticons (convert custom text object back to unicode) to clipboard
    • connect to QTextDocument::contentsChange() signal to get notified when a emoticon unicode gets pasted from clipboard
    • scan the contexts of the QTextEdit/QTextDocument character by character and check if it's unicode is is an emoticon
    • watch out for the UTF-8 and UTF-16 pitfall (!!!): use QChar::isHighSurrogate(), QChar::isLowSurrogate() and QChar::surrogateToUcs4() methods to convert between UTF-16/UTF-8 and check if a character is a emoticon unicode character
    • keep in mind that some emoticons consist of up to 4 characters which combined result in a single emoticon

    I researched quite some time before i started implementing, and that was the only way to generically implement this in Qt i've found. (Talking about QtWidgets, not QML)



  • I'm wondering if it isn't easier to just skip Qt completely. Use an html/js text editor in a QWebEngineView


  • Moderators

    @VRonin
    easier yes of course.
    But you will loose the benefits of using just plain widgets and also you add a huge dependency which might not be desired in the product or even runable on the target system.



  • Thanks for the detailed reply @raven-worx! That helps a lot. We're using a custom widget where we do our own painting, so from what I gather, it'd be easiest for us to take the emotion images and paint them ourselves.



  • @Vadi2
    Hi Vadi, Have you added support for emojis in qt application for windows. Have you added emoji support. It works well for colored emojis as well?. Please share how you implement it in qt application for windows.

    Thanks.



  • No, I haven't. It's too complicated in Qt right now.



  • @Vadi2 if your issue is solved, please don't forget to mark your post as such. Thanks.



  • @Vadi2
    Thanks for reply.



  • @raven-worx
    Have you implemented colored emojis properly in qt project in this way which you mentioned in this post?

    You did not mentioned when we get uint by combining high and low surrogate and it is emoticons, then how to render it in qt.
    Thanks in advance for your response.


  • Moderators

    @Sikander-Rafiq said in Emoji support:

    Have you implemented colored emojis properly in qt project in this way which you mentioned in this post?

    as written i used Twitter emoticon icons (PNGs), so yes they are colored.

    You did not mentioned when we get uint by combining high and low surrogate and it is emoticons, then how to render it in qt.

    As i mentioned use QTextObjectInterface. Following the same principle like in this example.


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.