Is it possible to put a hole in a surface gui?

I just need to put a hole in a surface gui, like a round one, and one that can affect a viewport frame.

1 Like

Can you elaborate so you aren’t speaking absolute nonsense

1 Like


uhh basically exactly like this just without using glass

1 Like

You can’t cut images directly, but I’m sire there’s “a” way to do it, I’ll look tomorrow

1 Like

I’m not a UI expert but is there a reason an image with a transparent circle in the middle wouldn’t work?

1 Like

No, I need a hole in a viewport frame.

1 Like

You could use ViewportFrame Masking to create a hole in a ViewportFrame with a “0 alpha mesh” which renders nothing behind it.
There’s an explanation on how to create 0 alpha meshes in the post along with a Blender file which contains a script for erasing mesh alpha.
This method wont create holes in the SurfaceGui itself though just the ViewportFrame.

Heres a place file with a 0 alpha circle mesh in a ViewportFrame: ViewportFrame_Hole1.rbxl (82.0 KB)

1 Like

There will be an entire map so and I cant really remake every mesh, because there will probably be a lot.

Ohh alright, yea in that case that masking method wont really work.
May I ask what you’re going to use the holes in the SurfaceGui for, what sort of an effect do you want to achieve with them?

complicated good-looking scope method

Sorry I cant really help much with that since I’ve never really experimented with scope systems.
Although I think currently the best way to make a scope is to use Boatbomber’s "Dual Render" Scope System which uses ViewportFrames for a picture in picture scope.
I’m not sure however how putting holes into the SurfaceGui can be used to improve the effect further.

The only way I know how to add holes to a ViewportFrame is to use the aforementioned masking method but as it requires manually made mask meshes it’s not really viable in your case.

If you want to can you further explain how you’d use the holes in a ViewportFrame for a scope? Maybe there is an alternative way to achieve a similar desired effect.

1 Like

I’m trying to do exactly that, but the reverse. I made a similar post, would you know what to do with this?

Using the info given in the topic’s replies so far I scripted this. It has 3 CanvasGroups parented under one another and a VieportFrame at the very bottom. All four have their own UIGradients which crop the image to the shape of the square’s front face.
The cropping breaks when the corners are behind the camera because of how Roblox’s built-in method WorldToViewportPoint for camera objects works.

UI objects' hierarchy

UIGradient_Cropping_Hierarchy1


Video

Place file: UIGradient_Cropping1.rbxl (59.3 KB)
(the scripts are rushed together but I added some comments to hopefully help understand it)

As this uses 3 CanvasGroups it can probably get more memory intensive as pointed out in the other reply. Each edge that gets cut out of the ViewportFrame uses an UIGradient and thus another CanvasGroup.

1 Like

uhh really I’m sorry but that’s not what I need.
The red is basically what I need, but this uses a glass part, which for certain reasons (it’s affected by the dof but I need it to not be), and the blue is ui gradients, and the blue would work if they just didn’t scale the whole image up/down.

1 Like