JavaFX: How can I display Emoji?
Asked Answered
M

3

10

I've been struggling with this problem a lot now and I can't seem to figure it out. I need some way of displaying Emoji's (as in WhatsApp) in a JavaFX Application.

I tried it with awt and Swing and I haven't had any success now (EDIT: swt works but probably just for Mac's) I tried it with extended Unicode and Codepoints but this didn't help. I hope it's even possible, because Windows usually doesn't let you display Emoji's (I myself use a Mac).

Today I stumbled over this post about Emoji's in JavaFX 8. There a guy says he has implemented a way of displaying Emoji's in JavaFX by extending the javafx.scene.text.TextFlow class. There is also a link to a little presentation and from the 57th slide upwards it explains these so called EmojiFlow objects a little. However I can't seem to find a download!

Thanks to everyone answering, I've been struggling so long with this one, maybe it even is impossible

Here is a little not working example:

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.VBox;
import javafx.scene.text.Text;
import javafx.scene.text.TextFlow;
import javafx.stage.Stage;

public class Main extends Application {
    @Override
    public void start(Stage stage) {
        VBox root = new VBox();

            // I used TextFlow here because the article suggested
            // extending this class, but I know it's not working
            // just like this
        TextFlow textFlow = new TextFlow(new Text("Should be alien smiley: "
                + (char) 0xF47D));

            // casting a hex number to a char is equal to using "\uF47D"
        root.getChildren().add(textFlow);
        Scene scene = new Scene(root);
        stage.setScene(scene);
        stage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}
Merline answered 4/4, 2014 at 20:33 Comment(4)
Is this just a problem on Windows? A quick test on my Mac pasting an Emoji from the Character Viewer in to a SWT app displayed without any problems.Amadavat
@Amadavat You're right! It does work with swt, I didn't test it good enough then or I forgot. But that is because swt uses native things wherever possible like the usual Mac text box which anyways can display Smiley's. Also using SWT would be very hard to do my application in, maybe it's possible to create swt subviews though?Merline
Is this even legal? I thought Apple had Emojis patented or something?Cosmogony
@OJKrylow Emoji are included in Unicode release 6Amadavat
F
3

There is a project on github pavlobu/emoji-text-flow-javafx it is a library for JavaFX the main purpose of which is to allow users to use extended TextFlow to display emojis. It helps to display consistent emoji images on different platforms where JavaFX application runs.

I had developed it to solve the problem of consistent cross-platform emoji displaying in JavaFX based UI applications. It also helps you to use different emoji images packs, you just need to download .jar with emoji pack that you want to use. Here is a link

Currently it is packed with one of these emoji style packs:

  1. openmoji
  2. twemoji
  3. emojitwo

You can even compile this library with your own emoji pack. The instructions how to do so are in README.md

Factitive answered 30/7, 2020 at 17:4 Comment(0)
T
-1

Follow these steps to add Emoji as a text:

  1. head to https://apps.timwhitlock.info/emoji/tables/unicode Search for any emoji you want and check its byte code (eg. \xF0\x9F\x98\x81)

  2. create a byte array and add byte code to it eg. I am using this emoji: 😁 and Its byte code is \xF0\x9F\x98\x81 so,


byte[] emojiByteCode = new byte[]{(byte)0xF0, (byte)0x9F, (byte)0x98, (byte)0x81};

  1. create a new string,

String emoji = new String(emojiByteCode, Charset.forName("UTF-8"));

  1. You can use this string as a label, button, etc. to display the emoji.
Tenace answered 15/5, 2021 at 6:4 Comment(0)
G
-2

There are two ways to do that:

  1. take an font that displays emiticons (less recomand)
  2. Use a Textflow and parse the Text like in the example below:

(I only did it so far for hyperlinks)

https://bitbucket.org/kogs/javafx-xmpp-client/src/660b12b5c514034ce78e1f653ea265cd74a645c6/src/main/java/de/kogs/xmpp/client/controller/MessageParser.java?at=master

and

https://bitbucket.org/kogs/javafx-xmpp-client/src/660b12b5c514034ce78e1f653ea265cd74a645c6/src/main/java/de/kogs/xmpp/client/TextParsing/?at=master

Simpler said:

Lookup the text for emoticons (":)",":P"...) and if you found one add a Imageview to the textflow and if not add a TextNode to the TextFlow

-->

"This text is passed :P to the parser"

  • This -> TextNode
  • text -> TextNode
  • ...
  • :P -> ImageView with the :P Image in it
  • to -> TextNode
Graven answered 10/11, 2014 at 15:49 Comment(3)
By using no fonts you can't scale the view. Using TextFlow is cool but you should use a Emoji based font for all found snippetsTripartite
Yes i Think your right. Using a Font is the best Way for doing this.Graven
Using a font might make it hard if the service you're supporting also has custom emoji, because you probably want all the emoji the same size, and if some come from images and others come from the font, it's tricky to line the sizes up.Poetry

© 2022 - 2024 — McMap. All rights reserved.