Process Unicode Zero Width Joiner to enable creation of "button hold ring" UI element with single Text Displayer
A common UI element in games is a "button hold ring" - a prompt that initially displays only the icon for a control button, but surrounds it with an animation of a ring filling up when the button is held.
At present these require two Text Displayers to create in Dreams:
- One to display the icon for the control button.
- One to display the animation of the ring filling up - its text is all of the hollow circle icons in sequence, and its display area only has enough room for one of them, so its animation progress tweak can be used to control which one is displayed.
But that's not a complete solution - if you want the button hold ring to have a background, you're restricted to two of the Text Displayer's display modes:
- Screen space - one of the Text Displayers has its background visible, and the sort order tweaks are used to ensure that that one is drawn behind the other.
- Sticker - the first created Text Displayer has its background visible, and it gets rendered first with the second created Text Displayer rendered on top.
If you want it freely positioned in scene space - which is a common way to display a button hold ring when it's used as an interaction prompt - neither Text Displayer can have the background visible, because you can't reliably control their draw order. They're rendered with midpoint depth sorting.
But what if you could do this with a single Text Displayer? You would need a way to tell Dreams that the control button icon and the hollow circle should be rendered in the same character space. And Unicode already has such a thing - the zero width joiner 0x200D. It already has defined behaviours for some pairs of characters between which it can appear, but Mm have used the basic multilingual plane's private use area for the icons, so they're free to define the behaviour of the zero width joiner when one or both of the neighbouring characters are one of those icons. If Dreams were to process this character by rendering the characters before and after in the same space, the button hold ring could be made with a single Text Displayer. The text would consist of the control button icon, followed by 16 sequences of three characters - the control button icon again, the zero width joiner, and one of the hollow circle icons. Controlling the animation progress would be a simple arithmetic progression, because advancing to the next state would always advance by the same number of characters.
-
I'm not sure that would work with the trick used to show only one of the icons, to have the first one still show up and then only the last one? Maybe I'm not thinking about it correctly...
You'd also need a calculator or two to adjust to that arithmetic progression, so you'd need an extra gadget anyway. If gadget count was what you were worried about.
There is actually a rule for which is on top, when they're both in the same position: newest on top. https://youtu.be/GkhC-HP61Oc?t=120 So basically, if it's rendering in the wrong order, copy the one you want to be on top and delete the original. Now it'll show on top.
Or you could offset them in the scene and put them in a chip, and use a teleporter to match-orientation of the player's view. This works like face-camera. It can be slightly laggy if you look closely, but most of the time is fine. Works fine for me, anyway. https://youtu.be/cM1lA7Fw0bw?t=445
-
Good idea! What they really need is an improved text entry tweak UI. Something like the collection editor. A new edit mode that opens up similar to shape edit. Let the user place text/icons in arbitrary locations within an edit area. Change color. Size. Weight. Pick icons. Etc. So a form of "rich text". That would be so useful and would probably cover your use case!
-
I'm not sure that would work with the trick used to show only one of the icons, to have the first one still show up and then only the last one?
It would never be showing the first character plus the last character - as I said here:
The text would consist of the control button icon, followed by 16 sequences of three characters - the control button icon again, the zero width joiner, and one of the hollow circle icons.
the control button icon would be repeated before each hollow circle icon, and there would be a zero width joiner between them to indicate that the two characters should be rendered in one character space. The text displayer would be displaying the last three characters - an icon, a control character, and another icon - in the single character space of its display area because the control character would be telling it to display the two adjoining characters in the same space.
You'd also need a calculator or two to adjust to that arithmetic progression, so you'd need an extra gadget anyway. If gadget count was what you were worried about.
Gadget count wasn't the problem. I'm currently experimenting with a "billboard rotator" that replicates the behaviour of the Text Displayer's "always face camera" tweak, but can be applied to a group of Text Displayers. I'm not sure if it'll solve the problem yet - that depends on exactly how the midpoint depth sorting works - but it's full of vector math and probably has more gadgets than anything suggested in this thread. The problem was the "freely positioned in scene or displaying a background, but never both" restriction.
Good idea! What they really need is an improved text entry tweak UI. Something like the collection editor. A new edit mode that opens up similar to shape edit. Let the user place text/icons in arbitrary locations within an edit area. Change color. Size. Weight. Pick icons. Etc. So a form of "rich text". That would be so useful and would probably cover your use case!
Yes, that would make the Text Displayer even more flexible. But it would need extra tweaks to control which subset of the text gets displayed. At present it only has a single animation progress tweak. With your idea, it would probably also need a 2-number fat wire tweak to control the X and Y scroll position.
-
Oooh, I understand now. Smart...
Regarding "face camera," that video link I left in my previous comment shows a way of doing that very easily with just a couple of gadgets.
Please sign in to leave a comment.