Hole circle UI transition help (borders)

So something like this;
https://gyazo.com/d4376a4f0a2d86641eb26ea8faaabaf7.gif

Here’s the ImageLabel

These four frames are the black border that forms from every side;
image

However, these frames are only 1000px wide, and I’m sure there’s some screens or something that may be 4k or even greater, leaving obvious holes like this example, if the screen is ridiculously large

Problem is, if I use scale instead of offset for the size, if the circle’s size is 0, the borders won’t show.

How would I keep a fixed scale around this image that uses scale? I don’t want a solution that says “increase the px to like 10000” etc. Hopefully a solution that doesn’t require script.

11 Likes

I’ve tried this once, I think the most efficient size for the surrounding border Frames is to set their Offsets to at least half the size of the screen’s resolution (ex. the ones on the sides should be as tall as but at least half as wide as the screen).

3 Likes

Then I guess it requires a script.

1 Like

I would connect some logic when the absolute size of the window changes, and update the elements of your pinhole transition accordingly.

Just keep the positions of everything the same but use anchor points so they stay on the right edges of the screen. Then simply give them 100% length or width depending on which side they are on and set their length (or height) to (hole.AbsoluteSize.X (or Y))/2