Absolute Position of an ui element

In Roblox Studio, if Frame B (child of Frame A) and Frame C (direct child of ScreenGui) are visually overlapping and have the same AbsolutePosition, why does this happen? How can two frames with different parents end up having identical absolute positions on the screen? Isnt absolute position related to the parent ?

AbsolutePosition is the position of a UI object’s top left corner. If two UI elements’ top left corners are at the same spot, they will have the same AbsolutePosition but may have differing Positions since the Position property is relative to the parent.

1 Like

so it had nothing to do with parenting?

Correct, AbsolutePosition has nothing to do with its Parent or ancestry

wbt the absolute size? how does it work?

So AbsolutePosition is a Vector2 whereas Position is a UDim2. A Vector2 has properties ‘X’ and ‘Y’ while a UDim2 is made of two UDim (one of X and one for Y) which each have properties ‘Scale’ and ‘Offset’. AbsolutePosition is the number of pixels away from the origin of the screen - which is the top left corner*. However, using Position you can describe how far away from the top left corner you want a ui element to be in terms of scale and offset.

For example, a Frame parented to a ScreenGui with Position UDim2.new(0.5, 0, 0.5, 0) (in the explorer this will look like {0.5, 0},{0.5, 0}) will have it’s top left corner at the center of the screen because the ‘Scale’ of each UDim is 0.5, aka 50%.

AbsoluteSize and Size have a similar relationship where AbsoluteSize is the size in terms of pixels regardless of what the object is parented to. Size is the size of the ui object relative to it’s parent. A Frame parented to a ScreenGui with Size {0.5, 0}, {0.5, 0} will take up half the screen in both the horizontal (‘X’) and vertical (‘Y’) direction.

1 Like

can things like canvas group affect the absolute position

No, a CanvasGroup is essentially just a Frame with some additional features which you can read about in the docs. A CanvasGroup and any descendants will still have an AbsolutePosition property representing the number of pixels their top left corner is from the top left of the screen*.

By the way, there’s a tutorial for all things UI.

*The top left of the screen can vary depending on device. You can read about what this means in the tutorial I linked.