compose-multiplatform
compose-multiplatform copied to clipboard
Emoji weirdness with compose desktop
Describe the bug why do emoji in text work differently on macos, windows, ubuntu? and why does it work really bad on all three? look at the 3 screenshots (lower right corner the emoji popup) how to display at least the first 20 smiley emoji properly on the main OS's with compose desktop?
what is used to draw smiley "images" instead of font? how does this work under the hood in compose desktop? is this a font issue? a gtk issue? openGL issue? i dont even know
and then even more weirdness:
also can anybody explain this screenshot ?
on the right in the popup the thumbup emoji is black and white font, in the text input box on the bottom then the exact same text is pasted into, it suddenly is a yellow graphic. and in the middle in the message view the exact same text is a yellow image graphic again.
whats going on here?
Affected platforms Select one of the platforms below:
- Desktop
Versions
- Kotlin version*: all
- Compose Multiplatform version*: all
- OS version(s)* (required for Desktop and iOS issues): Linux and others
- OS architecture (x86 or arm64): x86
- JDK (for desktop issues): 17 and 21
It's perfectly valid for emojis to look differently on different platforms. This is already the case for Android vs. iOS. See https://www.howtogeek.com/784832/that-emoji-might-not-look-the-same-on-your-friends-phone/ for example.
in the screenshot you can see the exact same emoji (copy and paste) look 2 different ways on linux 2 times its a black and white font with hand pointing to the left. in the middle its a yellow image hand pointing to the right
Hello, @zoff99. Could you please send a minimal reproducer for that behavior? And better screenshots, if possible.
in the screenshot you can see the exact same emoji (copy and paste) look 2 different ways on linux
That's likely a problem with transferring the text correctly through the clipboard.
i dont think so. its the same if you write it into the textfield programmatically
i dont think so. its the same if you write it into the textfield programmatically
Can you post a reproducer where putting the same text (programmatically) into a textfield results in different emojis being drawn?
👍
🫵👍
paste the above into a textfield in compose desktop. first paste the single emoji. then remove and paste the 2 emojis below.
you end up with different things like this screenshot. but emojis should render the same way.
you can also programmatically write it into the text field (i cant paste the text here, it will turn into an image, so its a screenshot)
and then
@m-sasha can you confirm the bug?
when i paste the right emoji to the start of the textfield, suddenly the middle emoji turns into a picture. when i remove the emoji from the start, the middle emoji turns back into a pumpkin ähm monochrome font item
and also why is the middle icon not a "yellow picture" in the first place? the picture clearly exists, otherwise how can i turn into a picture?
Doesn't appear to reproduce on macOS:
fun main() = singleWindowApplication {
Column(Modifier.fillMaxSize().background(Color.DarkGray)) {
TextField(
value = "\uD83D\uDC4D",
onValueChange = { }
)
TextField(
value = "\uD83E\uDEF5\uD83D\uDC4D",
onValueChange = { }
)
var text by remember { mutableStateOf("") }
TextField(
value = text,
onValueChange = { text = it }
)
}
}
https://github.com/JetBrains/compose-multiplatform/assets/5230206/3ec45292-51be-40ab-95f0-5ca6b2a0d828
on ubuntu 22.04:
there must be 2 bugs here. because apart from this weirdness, why is the yellow emoji not showing in the first place? the emoji image is clearly available, otherwise it couldn't show up later.
also i saw the same issue on manjaro linux
any idea yet where that bug can be located?
any news on that one? what library is used under the hood to draw those emoji on linux?
any more information what the underlying problem is?