2 KiB
| title | description |
|---|---|
| Page layouts | Explore how page layouts organize interface content into distinct pages. |
When you parent a Class.UIPageLayout to a UI container, every sibling Class.GuiObject becomes a unique page that you can transition to through scripting. This layout is useful when you want to create user interfaces such as tabbed modals, tutorials, or character customization screens.
After you create multiple pages within the Class.UIPageLayout, you need to use scripting to transition from page to page. For example, the following code, pasted into a client‑side sibling Class.Script of the layout, transitions forward and then backward between the pages every two seconds.
local frame = script.Parent
local pageLayout = frame:FindFirstChildWhichIsA("UIPageLayout")
task.wait(2)
pageLayout:Next()
task.wait(2)
pageLayout:Next()
task.wait(2)
pageLayout:Previous()
task.wait(2)
pageLayout:Previous()
If you want to view pages while editing in Studio, you can use the Command Bar to navigate from one page to another, letting you review where you need to make changes without having to play your experience each time.
-
In the Explorer window hierarchy, select the
Class.UIPageLayoutobject.
-
Open the Command Bar.
-
Input any of the following commands and press Enter.
Action Command **Next Page** `game:GetService("Selection"):Get()[1]:Next()` **Previous Page** `game:GetService("Selection"):Get()[1]:Previous()` **First Page** `game:GetService("Selection"):Get()[1]:JumpToIndex(0)`