Stuck Designing Chat System


I have no idea what this section is about, honestly. I’m a full time scripter and this is one of the rare times I try and make UI. Actually, this is one of the rare times I ask questions here cause I like thinking for myself.

I’m trying to create a pager system. So far it’s going well, no scripting problems. However, UI layouts give me a lot of restrictions. Basically, what I only need from these layouts are the FillDirection property since it quite helps.
If you have chatted before, (who doesn’t), in other platforms, you must be familiar with how text appears, right?

Like this (If ur not familiar)

A silly example lol

What you can notice is that text comes after a persons text, which is easy on studio. But how do you make text appear after YOUR text. I may be confusing, here’s my problem.


Basically, I want to turn the photo up there into the example image of WhatsApp I gave.
Any suggestions? Will be greatly appereciated!

A simple fix to this is making each chat template’s (assuming there are 2, left and right) frame take up the whole width of the frame that it is inside, even if the blue message itself does not span the whole width. Then use a UI list layout to automatically position them.

I completely understand what you mean. However, all the text will appear on the same side because the UIListLayout limits them to regardless of the size.

The player chats show on the opposite side from the rest of the group chats.

That is why I said put it in a larger frame that spans the whole width. Then you can put elements inside this frame and control where they are relative to left and right. UIListLayout only affects its direct children, and won’t move elements inside its children. They will only be moved to the relative position of their parent.

1 Like

Oh damn, ok that’s an idea I had but I kinda dismissed it :sweat:.

I just finished scripting a whole UI placement system lol. Nonetheless, thanks for the reply. Definitely gonna use this next time :ok_hand:

1 Like