Possible to prevent GUI transparency overlap?

Hi! Is it possible in ROBLOX to prevent the overlap of two GUI objects interfering with each other?

As far as I know, you either need to generate one image in a GFX software like this OR use two separate GuiObjects with circular images, set ClipsDesendants to true and position the two objects accordingly to overlap.

1 Like

Ah! ClipsDesendants! However this feature only works with rectangular GUI objects, not circular images?

It should work with any image GuiObject type as long as Rotation property is set to 0.

I’m not sure what you mean,
ClipsDescendants is basically a Square masking zone that cannot be Custom
This is limited exclusively to this, at best :
image

He desires the collision being Unicolor while staying transparent
image

Your only option is to make it as a single image for now.

2 Likes

Yeah exactly :slight_smile: It’s the rectangular masking zone I’m talking about

If the images he is using are symmetric in nature and he wants to accomplish the behavior seen in the picture from the original post, ClipsDescendants suffices when used in conjunction with ImageTransparency. It does not, however, work well for all cases of transparency overlap. :octopus: Notably, the downside to using it would be that you have two separate instances and its annoying as heck. So yes, the preferred way to go about this would be to make something in GFX software and create one image type GuiObject.

It would be fine to use the former method if he placed both image instances in a parent GuiObject and positioned/sized other elements appropriately.

1 Like

Unfortunately I can’t do this in a GFX software, as I intend to create a 2D drawing mechanism (with transparency):

image

Yea, I believe you put Clips as a solution due that the only reference given was Circles, which, is indeed possible to do if it’s a perfect mirror :
image

Also, if you intend to do a trail, can’t you just either make it square or non-transparent ? it’s rather minimal visually and i doubt people will be bothered by it lol

3 Likes

Aaah I get it now! The image has to be perfectly mirrored. Although I could add half a cirle at each end of the trail with a specific rotation. However there will still be gaps and overlaps between each rectangle since they all have various rotations. To fix this I will have to keep each rectangle inside a Frame with Clips set to true, where the rectangle’s rotation is dependent of the next rectangle’s rotation. I would also have to make sure that each rectangle’s outer edges meet with the next one. This turned out way more complicated than I thought, so I am going to evaulate if it’s worth the process. Although it’s always fun with a challenge :slight_smile:

This would be a perfect solution except that the trail will have sharp edges, as I’m not using circles between them.

I’m not sure about such challenge for a mere trail, but maybe it’s worth it, who knows?
In any case, it certainly have it’s use on UI, i’ve actually been practicing it a bit :


circles.rbxm (4.6 KB)

1 Like

That looks great! I never thought about the usage of Clips to prevent overlapping. Great to learn something new to expand my imaginary limit. Thanks to you both for helping me! Im going to mark this issue as solved :slight_smile:

1 Like