2.6 KiB
| title | description |
|---|---|
| Frames | Frames are basic containers for UI objects. |
Basic Class.Frame|Frames act as containers for other Class.GuiObject|GuiObjects such as labels and buttons. You can apply frames to display on a user's screen or on a surface within the experience.
Frames are ideal containers for responsive layouts such as list and flex layouts, allowing you to change the size of the frame and dynamically adjust how layout items fit within it. Class.Frame|Frames are also core Class.GuiObject|GuiObjects, so you can customize properties such as Class.GuiObject.BackgroundColor3|BackgroundColor3, Class.GuiObject.Transparency|Transparency, apply a background gradient or border, and more.
Aside from their common use as containers, you can also use Class.Frame|Frames for UI design. For example, as a visual separator between other UI elements, you can scale a frame to be thin and long until it becomes a line.
Clipping
By default, Class.Frame containers clip their content (child Class.GuiObject|GuiObjects) through the Class.Frame.ClipsDescendants|ClipsDescendants boolean. If you want children to appear outside of a frame's bounds, simply set Class.Frame.ClipsDescendants|ClipsDescendants to false.
Importantly, note that Class.Frame.ClipsDescendants|ClipsDescendants does not apply if the frame or any of its ancestors have a non‑zero Class.Frame.Rotation|Rotation; in such cases, descendants will render outside of the frame's bounds.
Automatic sizing
Frames can be set to automatically size depending on their content. To achieve this, set the frame's Class.Frame.Size|Size to the minimum width and/or height, then set its Class.Frame.AutomaticSize|AutomaticSize property to either Enum.AutomaticSize|X, Enum.AutomaticSize|Y, or Enum.AutomaticSize|XY depending on which axes automatic sizing should apply to. Once set, the frame will automatically resize based on the size of Class.GuiObject|GuiObjects and layouts within it.