Skip to main content

UI

Types​

Platform​

</>
type Platform = "Console" | "Mobile" | "PC"

Theme​

</>
interface Theme {
ClackAll: State<boolean>
ClackEnabled: State<boolean>
Transparency: State<number>
Primary: State<Color3>
PrimaryText: State<Color3>
Secondary: State<Color3>
SecondaryText: State<Color3>
Muted: State<Color3>
MutedText: State<Color3>
Border: State<Color3>
BorderMuted: State<Color3>
Valid: State<Color3>
Invalid: State<Color3>
FontSize: State<number>
Font: State<Font>
FontMono: State<Font>
FontHeavy: State<Font>
FontBold: State<Font>
FontSemiBold: State<Font>
FontLight: State<Font>
CornerRadius: State<UDim>
CornerHalf: State<UDim>
CornerDiameter: State<UDim>
Padding: State<UDim>
PaddingHalf: State<UDim>
PaddingDouble: State<UDim>
StrokeEnabled: State<boolean>
NormalTween: State<TweenInfo>
TransparencyClamped: State<number>
ScrollMidImage: State<string>
ScrollTopImage: State<string>
ScrollBottomImage: State<string>
}

A directory of Flux state for UI components to use as theme variables

ActiveStateType​

</>
type ActiveStateType = "hover" | "floating"

Properties​

GuiService​

</>
UI.GuiService: GuiService

TextService​

</>
UI.TextService: TextService

UserInputService​

</>
UI.UserInputService: UserInputService

LocalPlayer​

</>
UI.LocalPlayer: Player

PlayerGui​

</>
UI.PlayerGui: PlayerGui

Touch​

</>
UI.Touch: boolean

Platform​

</>
UI.Platform: Platform

Attribute​

This item is read only and cannot be modified. Read Only
</>
UI.Attribute: newproxy

A marker for defining Instance attributes in UI.edit

Children​

This item is read only and cannot be modified. Read Only
</>
UI.Children: newproxy

A marker for defining Instance children in UI.edit

Event​

This item is read only and cannot be modified. Read Only
</>
UI.Event: {
Attribute=newproxy,
Property=newproxy
}

Markers for defining events in UI.edit

Hook​

This item is read only and cannot be modified. Read Only
</>
UI.Hook: newproxy

A marker for defining UI state hooks in UI.edit

Nil​

This item is read only and cannot be modified. Read Only
</>
UI.Nil: newproxy

A marker for defining Nil defaultState in UI.makeStatefulDefaults

Scope​

</>
UI.Scope: Scope

A scope object for organizing and cleaning up UI states

TopbarInset​

</>
UI.TopbarInset: State<Rect>

GuiService.TopbarInset as a Flux state

LayerBottom​

</>
UI.LayerBottom: State<ScreenGui>

The lowermost ScreenGui for UI components

LayerDefault​

</>
UI.LayerDefault: State<ScreenGui>

The default ScreenGui for UI components

LayerTop​

</>
UI.LayerTop: State<ScreenGui>

The topmost ScreenGui for UI components

LayerTopBar​

</>
UI.LayerTopBar: State<ScreenGui>

The TopBar ScreenGui for UI components

TopBarFrame​

</>
UI.TopBarFrame: State<Frame>

A sorted TopBar Frame for UI components, parented under UI.LayerTopBar

Functions​

activateState​

</>
UI.activateState(
activeState: State<boolean>,
stateType: ActiveStateType
) → ()

A generalized function to handle activation/deactivation of both floating and hover states

deactivateState​

</>
UI.deactivateState(
activeState: State<boolean>,
stateType: ActiveStateType
) → ()

A generalized function to deactivate both floating and hover states

toggleState​

</>
UI.toggleState(
activeState: State<boolean>,
stateType: ActiveStateType
) → ()

A generalized function to toggle both floating and hover states

clearState​

</>
UI.clearState(stateType: ActiveStateType) → ()

Function to clear a specific state type

getLuminance​

</>
UI.getLuminance(color: Color3) → number

Gets the luminance of a Color3

invertLuminance​

</>
UI.invertLuminance(
color: Color3,
amount: number
) → Color3

Inverts the luminance of a Color3 by an amount

pointInGuiObject​

</>
UI.pointInGuiObject(
x: number,
y: number,
object: GuiObject
) → ()

Checks if x, y is within the absolute bounds of the GuiObject

makeStatefulDefaults​

</>
UI.makeStatefulDefaults(
default: Dict<any>,
definition: SpecialDefinition?
) → ()

Helper function for defining Flux state defaults

edit​

</>
UI.edit(
new: Instance | Dict<any>,
definition: SpecialDefinition | GuiObject
) → Instance | Dict<any>

Inherits Flux.edit

  • Parents children to the ._content variable of a UI component if one exists
  • Numeric indicies are defined as children with GuiObject.LayoutOrder set to the index
  • Allows UI.Hook to easily hook to default UI state or RBXScriptSignal aliases

new​

</>
UI.new(className: string) → UI.edit

Creates a new Instance with UI.edit

register​

</>
UI.register(
className: string,
class: Dict<any>
) → ()

Registers a new UI component class

registerChildren​

</>
UI.registerChildren() → typeof(UI)

Run to register all default children in the UI module

Show raw api
{
    "functions": [
        {
            "name": "activateState",
            "desc": "A generalized function to handle activation/deactivation of both floating and hover states",
            "params": [
                {
                    "name": "activeState",
                    "desc": "",
                    "lua_type": "State<boolean>"
                },
                {
                    "name": "stateType",
                    "desc": "",
                    "lua_type": "ActiveStateType"
                }
            ],
            "returns": [],
            "function_type": "static",
            "source": {
                "line": 399,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "deactivateState",
            "desc": "A generalized function to deactivate both floating and hover states",
            "params": [
                {
                    "name": "activeState",
                    "desc": "",
                    "lua_type": "State<boolean>"
                },
                {
                    "name": "stateType",
                    "desc": "",
                    "lua_type": "ActiveStateType"
                }
            ],
            "returns": [],
            "function_type": "static",
            "source": {
                "line": 420,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "toggleState",
            "desc": "A generalized function to toggle both floating and hover states",
            "params": [
                {
                    "name": "activeState",
                    "desc": "",
                    "lua_type": "State<boolean>"
                },
                {
                    "name": "stateType",
                    "desc": "",
                    "lua_type": "ActiveStateType"
                }
            ],
            "returns": [],
            "function_type": "static",
            "source": {
                "line": 438,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "clearState",
            "desc": "Function to clear a specific state type",
            "params": [
                {
                    "name": "stateType",
                    "desc": "",
                    "lua_type": "ActiveStateType"
                }
            ],
            "returns": [],
            "function_type": "static",
            "source": {
                "line": 450,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "getLuminance",
            "desc": "Gets the luminance of a [Color3]",
            "params": [
                {
                    "name": "color",
                    "desc": "",
                    "lua_type": "Color3"
                }
            ],
            "returns": [
                {
                    "desc": "",
                    "lua_type": "number\n"
                }
            ],
            "function_type": "static",
            "source": {
                "line": 467,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "invertLuminance",
            "desc": "Inverts the luminance of a [Color3] by an amount",
            "params": [
                {
                    "name": "color",
                    "desc": "",
                    "lua_type": "Color3"
                },
                {
                    "name": "amount",
                    "desc": "",
                    "lua_type": "number"
                }
            ],
            "returns": [
                {
                    "desc": "",
                    "lua_type": "Color3\n"
                }
            ],
            "function_type": "static",
            "source": {
                "line": 472,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "pointInGuiObject",
            "desc": "Checks if x, y is within the absolute bounds of the GuiObject",
            "params": [
                {
                    "name": "x",
                    "desc": "",
                    "lua_type": "number"
                },
                {
                    "name": "y",
                    "desc": "",
                    "lua_type": "number"
                },
                {
                    "name": "object",
                    "desc": "",
                    "lua_type": "GuiObject"
                }
            ],
            "returns": [],
            "function_type": "static",
            "source": {
                "line": 491,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "makeStatefulDefaults",
            "desc": "Helper function for defining Flux state defaults",
            "params": [
                {
                    "name": "default",
                    "desc": "",
                    "lua_type": "Dict<any>"
                },
                {
                    "name": "definition",
                    "desc": "",
                    "lua_type": "SpecialDefinition?"
                }
            ],
            "returns": [],
            "function_type": "static",
            "source": {
                "line": 498,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "edit",
            "desc": "Inherits [Flux.edit]\n* Parents children to the ._content variable of a UI component if one exists\n* Numeric indicies are defined as children with [GuiObject.LayoutOrder] set to the index\n* Allows UI.Hook to easily hook to default UI state or [RBXScriptSignal] aliases",
            "params": [
                {
                    "name": "new",
                    "desc": "",
                    "lua_type": "Instance | Dict<any>"
                },
                {
                    "name": "definition",
                    "desc": "",
                    "lua_type": "SpecialDefinition | GuiObject"
                }
            ],
            "returns": [
                {
                    "desc": "",
                    "lua_type": "Instance | Dict<any>\n"
                }
            ],
            "function_type": "static",
            "source": {
                "line": 521,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "new",
            "desc": "Creates a new Instance with [UI.edit]",
            "params": [
                {
                    "name": "className",
                    "desc": "",
                    "lua_type": "string"
                }
            ],
            "returns": [
                {
                    "desc": "",
                    "lua_type": "UI.edit"
                }
            ],
            "function_type": "static",
            "source": {
                "line": 610,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "register",
            "desc": "Registers a new UI component class",
            "params": [
                {
                    "name": "className",
                    "desc": "",
                    "lua_type": "string"
                },
                {
                    "name": "class",
                    "desc": "",
                    "lua_type": "Dict<any>"
                }
            ],
            "returns": [],
            "function_type": "static",
            "source": {
                "line": 618,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "registerChildren",
            "desc": "Run to register all default children in the UI module",
            "params": [],
            "returns": [
                {
                    "desc": "",
                    "lua_type": "typeof(UI)\n"
                }
            ],
            "function_type": "static",
            "source": {
                "line": 626,
                "path": "MainModule/Client/UI/init.luau"
            }
        }
    ],
    "properties": [
        {
            "name": "GuiService",
            "desc": "",
            "lua_type": "GuiService",
            "source": {
                "line": 54,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "TextService",
            "desc": "",
            "lua_type": "TextService",
            "source": {
                "line": 58,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "UserInputService",
            "desc": "",
            "lua_type": "UserInputService",
            "source": {
                "line": 62,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "LocalPlayer",
            "desc": "",
            "lua_type": "Player",
            "source": {
                "line": 66,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "PlayerGui",
            "desc": "",
            "lua_type": "PlayerGui",
            "source": {
                "line": 70,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "Touch",
            "desc": "",
            "lua_type": "boolean",
            "source": {
                "line": 78,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "Platform",
            "desc": "",
            "lua_type": "Platform",
            "source": {
                "line": 82,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "Attribute",
            "desc": "A marker for defining Instance attributes in [UI.edit]",
            "lua_type": "newproxy",
            "readonly": true,
            "source": {
                "line": 91,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "Children",
            "desc": "A marker for defining Instance children in [UI.edit]",
            "lua_type": "newproxy",
            "readonly": true,
            "source": {
                "line": 96,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "Event",
            "desc": "Markers for defining events in [UI.edit]",
            "lua_type": "{ Attribute = newproxy, Property = newproxy }",
            "readonly": true,
            "source": {
                "line": 101,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "Hook",
            "desc": "A marker for defining UI state hooks in [UI.edit]",
            "lua_type": "newproxy",
            "readonly": true,
            "source": {
                "line": 106,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "Nil",
            "desc": "A marker for defining Nil defaultState in [UI.makeStatefulDefaults]",
            "lua_type": "newproxy",
            "readonly": true,
            "source": {
                "line": 112,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "Scope",
            "desc": "A scope object for organizing and cleaning up UI states",
            "lua_type": "Scope",
            "source": {
                "line": 117,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "TopbarInset",
            "desc": "GuiService.TopbarInset as a Flux state",
            "lua_type": "State<Rect>",
            "source": {
                "line": 123,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "LayerBottom",
            "desc": "The lowermost ScreenGui for UI components",
            "lua_type": "State<ScreenGui>",
            "source": {
                "line": 131,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "LayerDefault",
            "desc": "The default ScreenGui for UI components",
            "lua_type": "State<ScreenGui>",
            "source": {
                "line": 143,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "LayerTop",
            "desc": "The topmost ScreenGui for UI components",
            "lua_type": "State<ScreenGui>",
            "source": {
                "line": 156,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "LayerTopBar",
            "desc": "The TopBar ScreenGui for UI components",
            "lua_type": "State<ScreenGui>",
            "source": {
                "line": 180,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "TopBarFrame",
            "desc": "A sorted TopBar Frame for UI components, parented under [UI.LayerTopBar]",
            "lua_type": "State<Frame>",
            "source": {
                "line": 193,
                "path": "MainModule/Client/UI/init.luau"
            }
        }
    ],
    "types": [
        {
            "name": "Platform",
            "desc": "",
            "lua_type": "\"Console\" | \"Mobile\" | \"PC\"",
            "source": {
                "line": 74,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "Theme",
            "desc": "A directory of Flux state for UI components to use as theme variables",
            "fields": [
                {
                    "name": "ClackAll",
                    "lua_type": "State<boolean>",
                    "desc": ""
                },
                {
                    "name": "ClackEnabled",
                    "lua_type": "State<boolean>",
                    "desc": ""
                },
                {
                    "name": "Transparency",
                    "lua_type": "State<number>",
                    "desc": ""
                },
                {
                    "name": "Primary",
                    "lua_type": "State<Color3>",
                    "desc": ""
                },
                {
                    "name": "PrimaryText",
                    "lua_type": "State<Color3>",
                    "desc": ""
                },
                {
                    "name": "Secondary",
                    "lua_type": "State<Color3>",
                    "desc": ""
                },
                {
                    "name": "SecondaryText",
                    "lua_type": "State<Color3>",
                    "desc": ""
                },
                {
                    "name": "Muted",
                    "lua_type": "State<Color3>",
                    "desc": ""
                },
                {
                    "name": "MutedText",
                    "lua_type": "State<Color3>",
                    "desc": ""
                },
                {
                    "name": "Border",
                    "lua_type": "State<Color3>",
                    "desc": ""
                },
                {
                    "name": "BorderMuted",
                    "lua_type": "State<Color3>",
                    "desc": ""
                },
                {
                    "name": "Valid",
                    "lua_type": "State<Color3>",
                    "desc": ""
                },
                {
                    "name": "Invalid",
                    "lua_type": "State<Color3>",
                    "desc": ""
                },
                {
                    "name": "FontSize",
                    "lua_type": "State<number>",
                    "desc": ""
                },
                {
                    "name": "Font",
                    "lua_type": "State<Font>",
                    "desc": ""
                },
                {
                    "name": "FontMono",
                    "lua_type": "State<Font>",
                    "desc": ""
                },
                {
                    "name": "FontHeavy",
                    "lua_type": "State<Font>",
                    "desc": ""
                },
                {
                    "name": "FontBold",
                    "lua_type": "State<Font>",
                    "desc": ""
                },
                {
                    "name": "FontSemiBold",
                    "lua_type": "State<Font>",
                    "desc": ""
                },
                {
                    "name": "FontLight",
                    "lua_type": "State<Font>",
                    "desc": ""
                },
                {
                    "name": "CornerRadius",
                    "lua_type": "State<UDim>",
                    "desc": ""
                },
                {
                    "name": "CornerHalf",
                    "lua_type": "State<UDim>",
                    "desc": ""
                },
                {
                    "name": "CornerDiameter",
                    "lua_type": "State<UDim>",
                    "desc": ""
                },
                {
                    "name": "Padding",
                    "lua_type": "State<UDim>",
                    "desc": ""
                },
                {
                    "name": "PaddingHalf",
                    "lua_type": "State<UDim>",
                    "desc": ""
                },
                {
                    "name": "PaddingDouble",
                    "lua_type": "State<UDim>",
                    "desc": ""
                },
                {
                    "name": "StrokeEnabled",
                    "lua_type": "State<boolean>",
                    "desc": ""
                },
                {
                    "name": "NormalTween",
                    "lua_type": "State<TweenInfo>",
                    "desc": ""
                },
                {
                    "name": "TransparencyClamped",
                    "lua_type": "State<number>",
                    "desc": ""
                },
                {
                    "name": "ScrollMidImage",
                    "lua_type": "State<string>",
                    "desc": ""
                },
                {
                    "name": "ScrollTopImage",
                    "lua_type": "State<string>",
                    "desc": ""
                },
                {
                    "name": "ScrollBottomImage",
                    "lua_type": "State<string>",
                    "desc": ""
                }
            ],
            "source": {
                "line": 251,
                "path": "MainModule/Client/UI/init.luau"
            }
        },
        {
            "name": "ActiveStateType",
            "desc": "",
            "lua_type": "\"hover\" | \"floating\"",
            "source": {
                "line": 396,
                "path": "MainModule/Client/UI/init.luau"
            }
        }
    ],
    "name": "UI",
    "desc": "",
    "source": {
        "line": 38,
        "path": "MainModule/Client/UI/init.luau"
    }
}