A simple library to add Emoji support to your Android Application

Overview

Emoji

A library to add Emoji support to your Android app. Emojis can be picked in a PopupWindow. In order to edit and display text with Emojis this library provides public APIs:

There's also a EmojiLayoutFactory, which can be used to get automatic Emoji support when using normal Android Views such as TextView, Checkbox, etc.

Material Design Library bindings can be included via:

implementation 'com.vanniktech:emoji-material:0.7.0'

There's also a MaterialEmojiLayoutFactory, which can be used to get automatic Emoji support.

The library has 4 different providers to choose from (iOS, Google, Facebook & Twitter).

iOS Emojis

Normal KeyboardEmoji KeyboardRecent Emojis

For getting the above iOS Emojis simply add the dependency and code below.

implementation 'com.vanniktech:emoji-ios:0.7.0'

And install the provider in your application class.

EmojiManager.install(new IosEmojiProvider());

Google

Normal KeyboardEmoji KeyboardRecent Emojis

For getting the above Google Emojis simply add the dependency and code below.

implementation 'com.vanniktech:emoji-google:0.7.0'

And install the provider in your application class.

EmojiManager.install(new GoogleEmojiProvider());

Facebook

Normal KeyboardEmoji KeyboardRecent Emojis

For getting the above Facebook Emojis simply add the dependency and code below.

implementation 'com.vanniktech:emoji-facebook:0.7.0'

And install the provider in your application class.

EmojiManager.install(new GoogleEmojiProvider());

Twitter

Normal KeyboardEmoji KeyboardRecent Emojis

For getting the above Twitter Emojis simply add the dependency and code below.

implementation 'com.vanniktech:emoji-twitter:0.7.0'

And install the provider in your application class.

EmojiManager.install(new TwitterEmojiProvider());

Custom Emojis

If you want to display your own Emojis you can create your own implementation of EmojiProvider and pass it to EmojiManager.install.

All of the core API lays in emoji, which is being pulled in automatically by the provided implementations:

implementation 'com.vanniktech:emoji:0.7.0'

Set up

Inserting Emojis

Declare your EmojiEditText in your layout xml file.

<com.vanniktech.emoji.EmojiEditText
  android:id="@+id/emojiEditText"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:imeOptions="actionSend"
  android:inputType="textCapSentences|textMultiLine"
  android:maxLines="3"/>

To open the EmojiPopup execute the code below:

final EmojiPopup emojiPopup = EmojiPopup.Builder.fromRootView(rootView).build(emojiEditText);
emojiPopup.toggle(); // Toggles visibility of the Popup.
emojiPopup.dismiss(); // Dismisses the Popup.
emojiPopup.isShowing(); // Returns true when Popup is showing.

The rootView is the rootView of your layout xml file which will be used for calculating the height of the keyboard. emojiEditText is the EmojiEditText that you declared in your layout xml file.

Displaying Emojis

<com.vanniktech.emoji.EmojiTextView
  android:id="@+id/emojiTextView"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"/>

Just use the EmojiTextView and call setText with the String that contains Unicode encoded Emojis. To change the size of the displayed Emojis use the lineHeight property from TextView.

EmojiPopup Listeners

The EmojiPopup builder allows you to declare several listeners.

setOnSoftKeyboardCloseListener(OnSoftKeyboardCloseListener listener);
setOnEmojiClickListener(OnEmojiClickListener listener);
setOnSoftKeyboardOpenListener(OnSoftKeyboardOpenListener listener);
setOnEmojiPopupShownListener(OnEmojiPopupShownListener listener);
setOnEmojiPopupDismissListener(OnEmojiPopupDismissListener listener);
setOnEmojiBackspaceClickListener(OnEmojiBackspaceClickListener listener);

EmojiPopup Configuration

Custom Recent Emoji implementation

You can pass your own implementation of the recent Emojis. Implement the RecentEmoji interface and pass it when you're building the EmojiPopup:

setRecentEmoji(yourClassThatImplementsRecentEmoji)

If no instance or a null instance is set the default implementation will be used.

Custom Variant Emoji implementation

You can pass your own implementation of the variant Emojis. Implement the VariantEmoji interface and pass it when you're building the EmojiPopup:

setVariantEmoji(yourClassThatImplementsVariantEmoji)

If no instance or a null instance is set the default implementation will be used.

Animations

Custom keyboard enter and exit animations

You can pass your own animation style for enter and exit transitions of the Emoji keyboard while you're building the EmojiPopup:

setKeyboardAnimationStyle(R.style.emoji_fade_animation_style);

If no style is set the keyboard will appear and exit as a regular PopupWindow. This library currently ships with two animation styles as an example:

  • R.style.emoji_slide_animation_style
  • R.style.emoji_fade_animation_style

Custom page transformers

You can pass your own Page Transformer for the Emoji keyboard View Pager while you're building the EmojiPopup:

setPageTransformer(new MagicTransformer());

If no transformer is set ViewPager will behave as its usual self. Please do note that this library currently does not ship any example Page Transformers.

Other goodies

  • MaximalNumberOfEmojisInputFilter can be used to limit the number of Emojis one can type into an EditText
  • OnlyEmojisInputFilter can be used to limit the input of an EditText to emoji only
  • SingleEmojiTrait can be used to force a single emoji which can be replaced by a new one
  • EmojiEditText#disableKeyboardInput() to disable normal keyboard input. To undo call #enableKeyboardInput()

Snapshots

This library is also distributed as a SNAPSHOT if you like to check out the latest features.

Note: The API is not stable and may change and break your code at any time if you use a SNAPSHOT.

Add this to your repositories:

maven { url "https://oss.sonatype.org/content/repositories/snapshots" }

And one of these to your dependencies:

implementation 'com.vanniktech:emoji:0.8.0-SNAPSHOT'
implementation 'com.vanniktech:emoji-ios:0.8.0-SNAPSHOT'
implementation 'com.vanniktech:emoji-google:0.8.0-SNAPSHOT'
implementation 'com.vanniktech:emoji-twitter:0.8.0-SNAPSHOT'
implementation 'com.vanniktech:emoji-facebook:0.8.0-SNAPSHOT'
implementation 'com.vanniktech:emoji-material:0.8.0-SNAPSHOT'

Proguard

No configuration needed.

License

Copyright (C) 2016 - Niklas Baudy, Ruben Gees, Mario Đanić and contributors

Licensed under the Apache License, Version 2.0

Comments
  • OOM with the new sheet approach

    OOM with the new sheet approach

    • Version of the library: Current SNAPSHOT
    • Affected devices: Low memory devices
    • Affected versions: Potentially all

    I ran into an OOM with one of my old devices when opening an Activity with an EmojiTextView. This is due to the emoji Bitmap being really large when decoded. I can't really use it in production like that sadly.

    I tried:

    I can't come up with a solution at this point. Maybe someone else has an idea? Otherwise: Should we revert?

    bug pr welcome 
    opened by rubengees 36
  • Fix Layout issues in EmojiDialog for several edge cases.

    Fix Layout issues in EmojiDialog for several edge cases.

    This PR fixes a few layout issues I've noticed, more importantly:

    • it now properly aligns the emoji keyboard above soft navigation buttons at the bottom on some phones
    • it now properly shows the emoji keyboard when using default edit text behaviour in horizontal orientation

    This is still WIP as I want to clean it up and test, but feel free to test it yourself and comment - all feedback is more than welcome.

    Signed-off-by: Mario Danic [email protected]

    opened by mario 25
  • Updated context for Nougat and newer devices

    Updated context for Nougat and newer devices

    Changed the argument of asActivity inside the EmojiPopup constructor to pass the root view. Changed the parameter of asActivity() in the Utils class to accept view instead of context. Added code for Nougat and later for getting context. For Nougat and later, rootView.getContext() returns an instance of DecorContext and not an Activity , so now the execution will not stop inside the while loop causing an anr.

    opened by DebdeepG 25
  • Galaxy E7 Duos 3G SM-E700H : On this device the soft keyboard and emoji pop are inflated together.

    Galaxy E7 Duos 3G SM-E700H : On this device the soft keyboard and emoji pop are inflated together.

    I have a Samsung galaxy E7 duos, while testing this library i found that the soft keyboard and emoji pop up are visible together. Is there a way or any workaround to handle this? Coz its working on all the devices except this one. I am attaching a screen shot to explain a bit more.

    samsung e7


    bug needs info pr welcome 
    opened by DalveerSinghDaiya 25
  • Center Emoji in line

    Center Emoji in line

    Hi,

    is it somehow possible to center an emoji in its line?

    7aee1719-fb3c-4110-b3ad-a08986765244

    I manually set the lineheight via emojiTextView.setLineSpacing(0f, 1.5f); Unfortunately the emoji "drops" and is not displayed centered.

    I could not find any method in your files to do this. If there is none could you add this in a future release please?

    With kind regards,

    Sebastian Schneider

    needs info 
    opened by Sese-Schneider 24
  • Rewrite for more Emojis, modularity and performance

    Rewrite for more Emojis, modularity and performance

    As discussed in #75.

    Contents of this PR

    Generator

    The folder generator contains a NodeJS script for updating the images and generating relevant java classes. This is done like follows: Download the file containing the emoji and the mapping file -> Index all the emojis and categories -> Copy the images to the drawable folders -> Generate the java files and copy them directly into the respective folders.

    Emojis are downloaded from here and the mapping file is from here.

    I may add a README with instructions on how to run the script later.

    Emojis

    This adds the latest iOS and EmojiOne Emojis. There are different modules for different variants.

    The benefits are:

    • Complete collection of all emojis (even with skin tones and even more than WhatsApp Beta currently has!)
    • Better image quality
    • Choice of Emoji collection

    Modularization

    There is now a core module named "emoji". For each emoji variant there is a "emoji-<variant>" module. As of this PR this are "emoji-ios" and "emoji-one". These modules have a dependency on "emoji", so the user can just write compile com.vanniktech.emoji-ios:version for instance. Furthermore, the user can pass an own instance of the new interface EmojiProvider. It is very easy to implement (just one method).

    The EmojiProvider is then (and has to be) registrered like this (In an Application subclass for example):

    EmojiManager.install(new IOSEmojiProvider()); // Or EmojiOneProvider or 
                                                  // custom implementation
    

    Categories

    Categories are now also generated and thus need to be more abstract. For this purpose, a new interface EmojiCategory which holds the icon for the category and all the emojis in the category. The EmojiView was changed to work with this new approach. The icons of the categories are from EmojiOne (including the recent icon), except the backspace icon, which I generated with the Android Studio Asset Studio. All of these icons are now vectors.

    Architecture and internals

    Parsing
    • I rewrote large parts of the emoji parsing to be much more flexible. I added a new data structure EmojiTree which holds paths to each emoji (each child is one character, if the child is the end of an emoji, it holds the respective resource). When parsing, the tree is traversed and the longest fitting path is used. This idea is from emoji-java, which does it quite similar.

    • A new singleton class EmojiManager holds the EmojiTree (and the categories), which is filled upon construction (Like the EmojiHandler before).

    • This also greatly simplifies the EmojiHandler, which now only iterates the String and looks up the emojis.

    Category adapter

    I noticed that the emoji picker is a bit laggy. To help with that, the EmojiArrayAdapter was changed to asynchronously load the images. This is done with a plain AsyncTask. Moreover the current approach with TextViews were replaced by ImageViews as this further improves performance. Another problem was, that the GridViews were hold in memory even when the PagerAdapter called the destroy-method. This could lead to OOMs, especially since the images know have better quality and thus are larger. This is know changed so that the GridView is inflated when requested and also properly destroyed.

    Emoji class

    I changed the Emoji class a bit to better work with the new architecture. It know holds the associated drawable resource and has new constructors. This required the RecentEmojiManager implementation to change a bit. Upon loading from disk, it searches the EmojiManager for the existing unicode. If not found, the emoji is discarded (This also improves compability between modules. If the user changes for example from ios to emojione and the latter does not contain an Emoji, the App will not crash). Furthermore it is also used in the new EmojiTree, reusing existing instances and thus minimizing unnecessary object allocation like before (Unicode Strings were allocated both for categories and the EmojiHandler).

    New Views

    I added a new View: SquareImageView`. As the name suggests, it draws the image in a square, with the width set for the height. This is used in the emoji picker.

    Minor other changes
    • I altered the value for the EmojiGridView item width a bit to make it look good with the new images.

    Just to clarify again: These changes are not directly backwards compatible

    This is what it looks like

    iOS | EmojiOne -- | -- device-2017-01-29-165256 | device-2017-01-29-165515

    Problems I noticed

    This is not directly related to this PR, but I noticed it when I worked on it:
    When adding many emojis to the EmojiEditText it becomes quite slow (I measured once and managed to get a freeze of 500ms). This is due to the EmojiHandler adding a span for each emoji, which is very unperformant. I looked into that, but didn't found a better solution... Maybe you now of a different way to approach this?

    I am almost certain that I forgot something so please have a look yourself (Especially at the Gradle config, I'm not sure if it is right and have no way of testing)!

    Moreover I do apologize for the awfully large PR, which makes GitHub freeze :grin:.

    opened by rubengees 24
  • Fix dialog calculations

    Fix dialog calculations

    The emoji keyboard wasn't working as expected when used inside a dialog. This PR fixes that.

    Please test both regular and dialog to make sure I didn't break anything :)

    Please note that I've based this on an AndroidX branch, but it could easily be back-ported, if needed.

    opened by mario 19
  • singleLine and ellipsize

    singleLine and ellipsize

    When i set android:singleLine="true" to EmojiTextView if the line contain emoji in the end of it show a part of this emoji after the ellipsize (...)

    https://imgur.com/a/z631RHe

    needs info 
    opened by 0mar-ahmed 19
  • Fix emoji only filter

    Fix emoji only filter

    Previously, when you enabled emoji-only filter and focused the edittext the emoji popup would appear.

    In the future, when you tried focusing it for the second time only a keyboard would open as in reality edittext is already focused.

    We now clear the focus after dismissing the emoji popup in case keyboard input is disabled.

    opened by mario 18
  • Back button hides pop up but it shows soft keyboard dismissing afterwards

    Back button hides pop up but it shows soft keyboard dismissing afterwards

    It is possible to dismiss the soft keyboard before dismissing the pop up? The way it is right now you can tell that the soft keyboard was behind even if I never showed it on the screen.

    the version that I am using is the last one and the device is a Samsung galaxy note 5 with lollipop.

    Thank you for filing an issue. If this is a bug that you want to report, please take the time to provide some information:

    • Version of the library:
    • Affected devices:
    • Affected versions:

    Screenshot(s) showing the issue and reprodution steps are appreciated.


    needs info 
    opened by jorgevalbuena56 17
  • Add animation support

    Add animation support

    I have added methods to allow for either returning a bitmap or an animated bitmap if isAnimated boolean is true. I created a new Category with the Flag symbol and used one of the sprite sheets already existing in order to do the testing (in the app itself the chosen category is the last in the line of category icons, you can see two flags at the end, it is the last flag). I was planning to use the same method that the current long sprite sheets use to display all images, just that instead of showing all these bitmaps separately, I combine all bitmaps into one animation to be played when selected. You can find this in the loadAnimatedStrip method. In order to create an animation I use the existing loadStrip method to create a sequence of bitmaps using AnimationDrawable object. The animation played for me when I tried starting the method in loadAnimatedStrip directly, however, it does not animate when I try to start the animation in drawAnimation method. This is where I get stuck and I cannot find why it does not work. I would appreciate if someone can have a short look and give me some hints on what might be going wrong! ;)

    opened by BennieBe 16
  • sync warning

    sync warning

    Thank you for filing an issue. If this is a bug that you want to report, please take the time to provide some information:

    • Version of the library:0.15.0
    • Affected devices:
    • Affected versions:

    Screenshot(s) showing the issue and reprodution steps are appreciated.


    image

    click [Show Details]

    Unresolved dependencies

    The consumer was configured to find an API of a component, preferably optimized for Android, as well as attribute 'com.android.build.api.attributes.BuildTypeAttr' with value 'debug', attribute 'com.android.build.api.attributes.AgpVersionAttr' with value '7.3.1'. However we cannot choose between the following variants of com.vanniktech:emoji-google:0.15.0:

    • jvmApiElements-published
    • jvmRuntimeElements-published
    • releaseApiElements-published
    • releaseRuntimeElements-published
    • samplessources All of them match the consumer attributes:
    • Variant 'jvmApiElements-published' capability com.vanniktech:emoji-google:0.15.0 declares an API of a component:
      • Unmatched attributes:
        • Doesn't say anything about com.android.build.api.attributes.AgpVersionAttr (required '7.3.1')
        • Doesn't say anything about com.android.build.api.attributes.BuildTypeAttr (required 'debug')
        • Provides a library but the consumer didn't ask for it
        • Doesn't say anything about its target Java environment (preferred optimized for Android)
        • Provides its elements packaged as a jar but the consumer didn't ask for it
        • Provides release status but the consumer didn't ask for it
        • Provides attribute 'org.jetbrains.kotlin.platform.type' with value 'jvm' but the consumer didn't ask for it

    Your library prevents me from adding additional code

    run failed,error logs

    image

    needs info 
    opened by SSSSunrise 3
  • new emojis do not show good on textview

    new emojis do not show good on textview

    Version of the library: emoji-ios:0.12.0 Affected devices: samsung Affected versions: android 11

    i tested on your code example and it works with the same problem, the new emojis show good and big only on EdiText but not on TextView

    Screenshot_20220516-154055_TalkFi Lite

    needs info 
    opened by hvar90 22
  • Wrong borders at the bottom

    Wrong borders at the bottom

    opened by kojid0 3
  • added  property to Emoji class to be used for pattern matching purposes

    added property to Emoji class to be used for pattern matching purposes

    This is to fix issues #485 and #484. I added a new property for Emoji for pattern matching purposes. The issue was that whenever the emoji has more than one code point, EmojiUtils.isOnlyEmojis() doesn't work.

    needs info 
    opened by tricksilver04 6
Releases(0.15.0)
Owner
Niklas Baudy
Freelance Software Engineer
Niklas Baudy
This library provides a simple way to add a draggable sliding up panel (popularized by Google Music and Google Maps) to your Android application. Brought to you by Umano.

Note: we are not actively responding to issues right now. If you find a bug, please submit a PR. Android Sliding Up Panel This library provides a simp

Umano: News Read To You 9.4k Dec 31, 2022
This library offers a simple method to add a small badge icon to your ActionBar-MenuItem

Android-ActionItemBadge ActionItemBadge is a library which offers a simple and easy to use method to add a badge to your action item! Screenshots Incl

Mike Penz 1.3k Jan 1, 2023
Add some depth to your Android scrolling.

Parallax Pager Add some depth to your Android scrolling using the parallax effect! Installation Step 1. Add the JitPack repository to your build file

Prolific Interactive 782 Dec 29, 2022
TourGuide is an Android library that aims to provide an easy way to add pointers with animations over a desired Android View

TourGuide TourGuide is an Android library. It lets you add pointer, overlay and tooltip easily, guiding users on how to use your app. Refer to the exa

Tan Jun Rong 2.6k Jan 5, 2023
Android library providing bread crumbs to the support library fragments.

Hansel And Gretel Android library providing bread crumbs for compatibility fragments. Usage For a working implementation of this project see the sampl

Jake Wharton 163 Nov 25, 2022
Android view that allows the user to create drawings. Customize settings like color, width or tools. Undo or redo actions. Zoom into DrawView and add a background.

DrawView Android view that allows the user to create drawings. Draw anything you like in your Android device from simple view. Customize draw settings

Oscar Gilberto Medina Cruz 839 Dec 28, 2022
PCard Add payment card screen made using JetPack Compose

PCard Add payment card screen made using JetPack Compose Find this repository useful? ❤️ Support it by joining stargazers for this repository. ⭐ And f

Mohamed Elbehiry 61 Dec 16, 2022
Bubbles for Android is an Android library to provide chat heads capabilities on your apps. With a fast way to integrate with your development.

Bubbles for Android Bubbles for Android is an Android library to provide chat heads capabilities on your apps. With a fast way to integrate with your

Txus Ballesteros 1.5k Jan 2, 2023
Make your native android Toasts Fancy. A library that takes the standard Android toast to the next level with a variety of styling options. Style your toast from code.

FancyToast-Android Prerequisites Add this in your root build.gradle file (not your module build.gradle file): allprojects { repositories { ... ma

Shashank Singhal 1.2k Dec 26, 2022
Make your native android Dialog Fancy. A library that takes the standard Android Dialog to the next level with a variety of styling options. Style your dialog from code.

FancyAlertDialog-Android Prerequisites Add this in your root build.gradle file (not your module build.gradle file): allprojects { repositories { ..

Shashank Singhal 350 Dec 9, 2022
Android SegmentedControl + multi row support

Android SegmentedControl + multi row support + multi selection minSdk API 14+ Demo App, Play store link Or try demo App online ! Segmented control for

Robert 152 Dec 29, 2022
This is a picker view for android , support linkage effect, timepicker and optionspicker.(时间选择器、省市区三级联动)

Android-PickerView English Document 注意事项、详请使用方式、更新日志等,请查看 Wiki文档 Wiki文档,Wiki文档,Wiki文档 !~ 重要的事情说三遍 对于使用上有任何疑问或优化建议等,欢迎加入QQ群讨论交流技术问题。 交流群1: 387051294(推荐

Bigkoo 13.2k Jan 6, 2023
Extend From VLayout, and it will support Android X

XVLayout Extend From VLayout, and it will support Android X 从VLayout库克隆,支持Android X的RecyclerView 详细使用说明,参考:https://github.com/alibaba/vlayout Main Fea

null 1 Dec 8, 2021
Have a look at Job Allocation app build with SQLite database and Kotlin support

Job Allocation Overview Do you remember or forget sometimes to whom you allocated a task ?? Have a look at Job Allocation app build with SQLite databa

null 0 Dec 13, 2021
A simple library to let you sign (or draw lines) smoothly with your finger into a view and save it.

FingerSignView Introduction FingerSignView is a simple library that lets you finger, or draw lines, smoothly with your finger into a View and save it

Agnaldo Pereira 25 Nov 20, 2022
Simple and lightweight UI library for user new experience, combining floating bottom navigation and bottom sheet behaviour. Simple and beautiful.

Simple and lightweight UI library for user new experience, combining floating bottom navigation and bottom sheet behaviour. Simple and beautiful.

Rizki Maulana 118 Dec 14, 2022
A drawing view for your android application.

Android Draw A drawing view for your android application Download For information : checkout Sample App Code in repository. Dependency Step 1. Add the

Divyanshu Bhargava 409 Dec 30, 2022
A simple screen that is shown when your app gets crashed instead of the normal crash dialog. It's very similar to the one in Flutter.

Red Screen Of Death What A simple screen that is shown when your app gets crashed instead of the normal crash dialog. It's very similar to the one in

Ahmad Melegy 178 Dec 9, 2022
Sentinel is a simple one screen UI which provides a standardised entry point for tools used in development and QA alongside device, application and permissions data.

Sentinel Sentinel is a simple one screen UI that provides standardised entry point for tools used in development and QA alongside device, application

Infinum 29 Dec 12, 2022