Make a SurfaceGUI fit to the screen and then crop

Help and Feedback Scripting Support
#1

So, i have a SurfaceGUI, I want to make the corners touch the edge of the screen and then it gets cropped in the shape of the surface its on.

Before Crop

Screenshot_677
Screenshot_677801×601 10.3 KB

After Crop

Screenshot_678
Screenshot_678801×601 7.89 KB

In this particular case I am using a Viewport Frame, I am making a Non-Euclidian effect and all I need now is depth.

This is my first ever post on the DevForum, so if any more information is needed to help please let me know.

#2

I think you sort of buried the lead with your question :slight_smile:

You’re really trying to make a portal, it seems.

This thread seems to have a lot of information and other approaches that could be useful to you: Re-Creating a Portal Effect,

#3

I am aware of this threads existence, and I just have one issue that I cant solve, and its the one provided above. I already looked for the answer in that thread. Do you possibly know how I could achieve this?

#4

The final link in the answer post includes a rbxl file that you can open in studio.

ReplicatedStorage.ViewportWindow seems to be doing what you want, you can dig into that and see what it’s trying to do. At a quick glance it seems like:

  • It figures out the world-space CFrame and Vector2 size in the :GetSurfaceInfo() method (similar to how I do it in this thread)
  • Change the FOV of the viewport’s camera to be based on the size of the surface, and the distance of the player’s camera to the surface along the normal axis
    local rDist = (camCF.p - surfaceCF.p):Dot(surfaceCF.LookVector)
local newFov = 2*math.atan2(surfaceSize.y/2, rDist)
  • (The important part you’re looking for) figures out how much to move the viewport frame up and to the left so it looks cropped in the right place:
    local rPoint = surfaceCF:PointToObjectSpace(camCF.p)
local sX, sY = rPoint.x / surfaceSize.x, rPoint.y / surfaceSize.y 
...
vpf.Position = UDim2.new(vpf.AnchorPoint.x - sX, 0, vpf.AnchorPoint.y - sY, 0)
  • Does some other stuff to figure out how big the viewportframe should actually be that I don’t quite understand atm:
    local scaleX = 1 + math.abs(sX)*2
local scaleY = 1 + math.abs(sY)*2
local scale = math.sqrt(scaleX*scaleX + scaleY*scaleY)
...
vpf.Size = UDim2.new(scale, 0, scale, 0)

There’s more stuff in there. Read through the code and try to understand it, or just use it directly.

#5

Thank you very much for sifting through all that for me! I cannot express my gratitude!