How could I have a ImageLabel that Clips on a corner?

Hey, I’ve just had this issue that I don’t know how I could fix.

Alright so lets just get to the point. I’ve made a example of what I want in a Photo Editing Tool like so

So basically the Red part is the Image that also has this edge on the Right hand side which you should be able to see
The Blue is what should stay/not get clipped out from the image
and lastly the Green is what should get clipped.

Basically my ImageLabel seems not to clip the area out even though that ClipDescendants is enabled:
image

How could I resolve this, other threads has “resolved” this but I don’t actually see any sort of fix to my issue and doesn’t really show how to do it because they’re mostly unclear to me.

Could anyone help me with this one?

1 Like

I think since the dark red part is an image label it has a rectangular hitbox, you have to make the hitbox yourself with rotated frames or use another image for the bright red part

2 Likes

I might of not sent the right image actually
image
(The ImageLabel/DarkRed Part is ontop of a Frame which is transparent)

Wdym Hitbox, could you explain?

1 Like

Click on the dark red frame and you will see a white border around it. That’s the area that clips the descendants

1 Like

Try setting the Index of the not clipped part higher

1 Like

Setting the ImageLabels or Frames zIndex won’t resolve the issue that I have :frowning:

1 Like

Yeah alright, but if I want to set the area (In Purple) that I don’t want and I want it to Clip it out, how would I do that.



image

1 Like

Try adding a rotated frame that clips out that part

ClipDescendants works exclusively on the bounding box of any GuiObject - it doesn’t care about the image itself.

A good alternative is to use UIGradients, where you have 2 colors but you make them “fade across” really quickly. The idea is to make sure the “fade” is unnoticeable, so you get a crisp edge between the colors, which can then be adjusted during runtime to make a good resource bar.

Keep in mind though, that changing colors for a UIGradient during runtime can be expensive.
If performance is a concern, you may want to use UIGradient.Offset to adjust the position of the edge instead.

I also hope the images are (or will be) white, or this idea is not going to work well.

2 Likes

I’ll try this out thanks :slight_smile:

1 Like

Yeah this resolved my issue quite well, thanks for the quick response :smiley:

1 Like

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