The title says it all, how can I see that a position of a gui is inside the camera (all inside, not only the anchor position but also the rest of the gui)?
local Workspace_Service = game:GetService("Workspace")
local Camera = Workspace_Service.CurrentCamera
function IsGuiInViewport(GuiObject)
local LowerBound = Camera.ViewportSize.Y - GuiObject.AbsoluteSize.Y
local RightBound = (Camera.ViewportSize.X - GuiObject.AbsoluteSize.X) + 1
local UpperBound = 0
local LeftBound = 0
if GuiObject.AbsolutePosition.X >= LeftBound and GuiObject.AbsolutePosition.X < RightBound and GuiObject.AbsolutePosition.Y >= UpperBound and GuiObject.AbsolutePosition.Y < LowerBound then
return true
else
return false
end
end
Hello, I created this simple function to check if a gui element is inside of the viewport. You can modify it to adjust to your needs as this supposedly works only with my setup. If your ScreenGui has IgnoreInset enabled, you may want to set the UpperBound to -36, otherwise all gui elements that touch the topbar will return false.
An example of usage would be:
print(IsGuiInViewport(Gui_Object))
-- if the object is fully within the viewport, this will print true, otherwise false
Also, this post should go in #help-and-feedback:scripting-support as this is more of a scripting concern than a design concern.
Thx you very much, but but what’s that?:
Camera.ViewportSize.Y - GuiObject.AbsoluteSize.Y
What can you do with it and why - and not +?
Edit*: Ok, so I don’t understand why you use absolute size and why you subtract something here?
Why +1?
local RightBound = (Camera.ViewportSize.X - GuiObject.AbsoluteSize.X) + 1
To go more in-depth about how the function works,
local LowerBound = Camera.ViewportSize.Y - GuiObject.AbsoluteSize.Y
This will get a Y position on the screen that we can reference if we want to check if a gui is fully within the viewport. The lower bound is obviously the point at the bottom of the screen that a ui element cannot go past.
local UpperBound = 0
Upper bound on the other hand is always set to 0 because the point of origin for GUIs will always be on the upper left corner, same applies to the left bound.
local RightBound = (Camera.ViewportSize.X - GuiObject.AbsoluteSize.X) + 1
Right bound has the same logic and gets the point on the right side of the screen.
Is the result of this minus calculation positive, does that mean that the Gui is inside?
I added 1 because if a GUI’s side is perfectly aligned with the right side of the screen, the function will return false. This is because the if statement expects the X position of the gui object to be always greater than the RightBound. You may change the if statement to this instead:
if GuiObject.AbsolutePosition.X >= LeftBound and GuiObject.AbsolutePosition.X <= RightBound and GuiObject.AbsolutePosition.Y >= UpperBound and GuiObject.AbsolutePosition.Y < LowerBound then
and remove the + 1 from the right bound variable
I’m sorry for all these questions, this one is (usually) the last one: Wouldn’t the script be more precise if you also calculated the position?
The function uses the passed GUI object’s position to determine if it is fully within the viewport, can you please explain further what you mean?
I want to make it so that a gui spawns to a random position, but now let’s say that part of its left side would be outside of ViewportSize, but could your script notice it?
Here’s a more in-depth explanation:
Let’s say this is our screen and its dimensions are 1920 x 1080
Notice the red dots, the red dot on the upper left will have a position of (0,0) and the red dot on the lower right will have a position of (1920, 1080)
To apply this knowledge to my function, we check the absolute postion of a GUI object and make necessary calculations to make it do what we intend it to do. A gui’s absolute postion is always determined by upper left point as shown below:
Since the upper left point of the green gui object is exactly at the upper left point of the screen, the absolute position will be (0,0)
However if the gui object was at the lower right corner, we would not exactly get an absolute position of (1920, 1080). This is because the upper left corner of the green gui object is not at the lower right corner of the screen.
So first off, we set the bounds of the screen for reference
local UpperBound = 0 --since we know that a gui will be fully inside the screen when the Y absolute position is equal to or greater 0
local LeftBound = 0 --since we know that a gui will be fully inside the screen when the X absolute position is equal to or greater than 0
Now we solve the issue with the lower and right bound. Since we know the screen size is 1920 x 1080, we simply subtract those values to the size of the gui object. Let’s say our gui object’s size is 100x100:
local RightBound = 1920 - 100
local LowerBound = 1080 - 100
However, our gui objects and screen sizes will not always have the same values, so we need to use the direct properties of these objects:
local RightBound = Camera.ViewportSize.X - GuiObject.AbsoluteSize.X
local LowerBound = Camera.ViewportSize.Y - GuiObject.AbsoluteSize.Y
Now that we have these bounds, as long as the gui object’s absolute position is greater than or equal to the upper bound and left bound, and is smaller than or equal to the right bound and lower bound, it’s safe to say that the gui object is fully within the viewport.
This is another approach, my function only tells you if a gui object is fully within the viewport. If you want to accomplish something like this, you can apply the equations used in my function as they are what you would want to use to accomplish this.
You will have to make use of math.random()
, an example would be:
local RandomX = math.random(0, Camera.ViewportSize.X - GuiObject.AbsoluteSize.X)
local RandomY = math.random(0, Camera.ViewportSize.Y - GuiObject.AbsoluteSize.Y)
GuiObject.Position = UDim2.new(0, RandomX, 0, RandomY)
I haven’t tried this, so it may not work.
Thanks for that great answer, I understand better now the guis.
The last reply: One subtracts the size of the camera with the size of the gui. Why with the size of the gui (you don’t have to answer what you did is even more than what I expected. You are damn good)?
The position says where the upper left corner of the gui will be (by default). If it’s positioned to align with the right edge, its position will be the size of the screen minus the gui size. You can test this in studio, too, try dragging a gui to the edge of the screen and checking its absolute position, then check how big the screen size is.
This isn’t really a good solution since it completely ignores AnchorPoints, but it’s fine for your case.