Emoji Toolbar Control šŸ˜Ž

The use of Emoji in text based softwares and editors are properly justified. LibreOffice was lacking this cool featureĀ šŸ˜. Me and my mentors, Samuel Mehrbrodt and Yousuf Philips, decided to work on Emoji integration in LibreOffice as part of my GSoC contributions.We planned to create a working control with proper emoji font support by the end of summer of code. This post provides an overview of the work done. The entire description of the idea can be found hereĀ Discussion on Emoji Integration.

User Interface

  • Control to be available in Writer, Impress and Draw, accessible viaĀ Standard Bar.
  • No UI idea proposed throughout the discussion. Hence, I was free to use any sort of widgets to facilitate the purpose.
  • Use of tabs to filter emojis based on categories
  • Emojis should appear as a grid
  • Easy insertion, unlike special character control which uses a modal dialog as of version 5.2
  • Font support (Removal of tofu char šŸ¤“Ā )
  • Functionality should be present as a toolbar control, primarily in Standard bar
  • Proposed search filter (Only after the emoji details are translated and made locale-dependent)

Ā Backend, JSONĀ Database and Font Support

  • Populate the control by parsing a JSON file which contains the data of all the emoji glyphs
  • Support most of the unicode glyph by packaging a emoji-specific font ‘Noto Emoji‘ by Google
  • Insert the unicode glyph to the editing pad formatted by the Noto font
  • Orcus JSON Parser to parse the json data file
  • Glade for UI designing and custom widget integration
  • Creation of custom widget to renderĀ font glyphs as a grid
  • Facilitate glyph insertion using InsertSymbol uno command.

Emoji Toolbar Control

After some pre-plannedĀ development and tricky debugging, I finally managed to get the toolbar control working. The beta version of toolbar control was merged and is ready to use, thanks to the help and guidance I got from my mentor and LO developers.Ā Patch: GSoC Emoji Control: patch which makes all the above changes to LO.

emoji3a.png

Emoji Toolbar Control

Emojis gets inserted into the pad on clicking the respective emoji.

emoji4b.png

One should remember that unlike svg or png emoji, these emoji are glyphs of a particular unicode sequence. They hold all the properties of normal texts. Their colour and size can be changed just like any other character glyph.

emoji48.png

The enhancement still needs some love to become bug free. The emoji control is hidden in the standard bar by default. It can be activated by right-clicking on the standard bar and going to Visible Buttons > Emoji Control. Another way to do so is by using the Customize dialog. Go to Tools > Customize and navigate as shown in the picture below.

emoji5b.png

Activate Emoji control from customize dialog

The foundation for this enhancement has been built now. Further improvements have beenĀ proposed like:

  • FilteringĀ of unsupported glyphs
  • Removal of duplicate glyphs (multicolor emoji are treated as duplicate glyph) as multicolor glyphs are not supported by any font
  • support for svg emoji, etc.

Cheers šŸ»