Pango cairo custom shape renderer with multiple character strings

I’m trying to see if I can use Pango to render “custom emojis” that you see on chat networks like discord, slack, twitch, etc. I followed the examples/pangoshape.c example and have had some success, but part of my requirements is that I need to use one shape for multiple characters in the text that’s being laid out. For example, if I see the text “kapow test” I want to to replace it with " text".

Now I have that somewhat working, but the issue is that the shape is being rendered for each character in the text. I have specified a range in the shape attribute and kind of hoped that’d just hide all of that text and use my shape once, but apparently that’s not how it works. You can see an example here


I just noticed that the range is off in this image, sorry about that, I had hard coded it and just didn’t notice :-/

Alignment and scaling is wrong, but what I’m aiming for here is to just show the KAPOW once but leave the original text intact so that i can be pulled out of the layout later (so the user can copy/paste/etc).

So my question is, is this possible, and if so how? I’ve scoured the docs and examples and I just can’t seem to find anything that can help me. I can provide the full code if necessary, it’s just kind of messy as I’ve been trying all sorts of things to make this work.

1 Like

Shape attributes are about replacing glyphs, so you’ll get a shape drawn for each glyph.

I would suggest to do this with text manipulation. Replace each occurrence of the string “kapow” with a single Unicode characters (doesn’t really matter which one), and then use a shape attribute around that one character, and pass information about the image to render in the attribute data.

I was afraid that was going to be the solution. The problem with that is it basically doubles my memory requirements as I’ll have to hold the original string (for copy/paste/logging/etc) and then give pango it’s specific text for rendering. This is nearly a non-starter for busy chat rooms.

Aside from that, most of the chat networks give me the start and end offset of the image replacement, so by changing all those sizes means a ton of basic math for emote heavy text which I would very much like to avoid.

That said, if I’m just dropping in any unicode character I assume U+FFFD would work fine since I’d be specifying the name of the icon in the pango attribute?

You can perhaps try to come up with a solution that makes all shapes but the one for the first glpyh of a segment come out empty. I haven’t thought deeply about it

The more I think about this the more I can’t avoid the memory cost because my application and Pango are each going to have their own copy regardless. That said, if there was a way I could avoid iterating every string a second time that’d save me a ton of CPU time.

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.