How to put a custom emoji in a SwiftUI app?

Question

So I downloaded the zip: https://github.com/hfg-gmuend/openmoji, opened it up, opened the font folder, and dragged the OpenMoji-Color.ttf file into my Xcode project, but then I realized it's not really a "font" that modifies existing text, so how exactly do I put the emojis inside of strings, or Images or something like that?

Normally, I'd do something like:

Text("👀")
    .font(Font.custom("OpenMoji-Color", size: 20))

Alternatively, I was hoping to do something like:

Image("👀") //somehow modify it to be in the correct OpenMoji style

Does anyone know how to do this?

Answer 1

I think the safest bet would be to load the specific ones you want to use as images. In the OpenMoji .zip file the .png files of all emojis are contained in file "color". You could drag them from there to your Xcode app bundle Assets folder.

After that you can directly load them by referencing to the image names (unicode in this case).

struct ContentView: View {
    var body: some View {
        Image("1F440")
    }
}

Alternatively if you have multiple ones you can make an array which holds all of your images and reference them from there.

struct ContentView: View {

    @State private var mojis = ["1F440", "1F1EA-1F1FA"]

    var body: some View {
        Image(mojis[1])
    }
 }