Skip to main content

Frame Element

Frame is a fundamental UI element in Weo, used as a container for other UI objects.

Frame Element
Element
​

Constructor​

Frame.new()
Function
​

Frame.new(RenderSurface, FrameProperties)​

  • Creates a new Frame on the given RenderSurface.

Parameters:

  • RenderSurface

    RenderSurface

    • The RenderSurface where the Frame will be rendered.

  • FrameProperties

    table

    • A table containing properties for the Frame.

    • absolute

      table
      — READONLY: Absolute position and size of the Frame. Changing this property has no effect.

      • Table containing absolute position and size:
      • position
        Vector2
        — Absolute position of the Frame.
      • size
        Vector2
        — Absolute size of the Frame.

    • position

      UDim2
      — Position of the Frame.

    • size

      UDim2
      — Size of the Frame.

    • bgcolor

      number?
      LinearGradient?
      RadialGradient?
      - Background color of the Frame.

    • visible

      boolean?
      — Whether the Frame is visible.

    • borderRadius

      number?
      — Radius of the Frame's corners.

    • zIndex

      number?
      — Z-index of the Frame.

    • parent

      any
      RenderSurface?
      — Parent container of the Frame.

    • borderColor

      number?
      — Border color of the Frame.

    • borderThickness

      number?
      — Border thickness of the Frame.

    • cursor

      string?
      — Cursor style of the Frame.

    • opacity

      number?
      — Opacity of the Frame,this overwrites the bgcolor property. Does not applies to Gradient types.

    • class

      table?
      — Class of the Frame,for the ThemeService.

      • Table containing class properties:
        • This property expects table<string|nil>|nil.

    • padding

      table?
      — Padding of the Frame.

      • Table containing padding properties:
        • top
          number?
          — Top padding of the Frame.
        • bottom
          number?
          — Bottom padding of the Frame.
        • left
          number?
          — Left padding of the Frame.
        • right
          number?
          — Right padding of the Frame.

Methods​

(Frame):Destroy()
Function
​

  • Destroys the Frame and all its children.

Calling :Destroy() does not set your variable to nil. The object will no longer be rendered or functional, but the Lua variable holding the reference. You must set object to nil if you want to allow the object to be garbage collected.

(Frame):show()
Function
​

  • Makes the Frame visible.

(Frame):hide()
Function
​

  • Hides the Frame.

Signals​

(Frame).MouseHover
Signal
​

  • Fires when the mouse hovers over the Frame.

Parameters:

  • position
    Vector2
    — hover position relative to the window
  • buttons
    table
    — mouse buttons state
    • Table containing mouse button states:
      • left — Left mouse button state.
      • middle — Middle mouse button state.
      • right — Right mouse button state.
      • control — Control key state.
      • shift — Shift key state.

(Frame).MouseButton1Click
Signal
​

  • Fires when the Frame is clicked with the left mouse button.

Parameters:

  • position
    Vector2
    — click position relative to the window

(Frame).MouseButton2Click
Signal
​

  • Fires when the Frame is clicked with the right mouse button.

Parameters:

  • position
    Vector2
    — click position relative to the window

(Frame).MouseButtonDown
Signal
​

  • Fires when a mouse button is pressed down on the Frame.

Parameters:

  • position
    Vector2
    — mouse position relative to the window
  • buttons
    table
    — mouse buttons state
    • Table containing mouse button states:
      • left — Left mouse button state.
      • middle — Middle mouse button state.
      • right — Right mouse button state.
      • control — Control key state.
      • shift — Shift key state.

(Frame).MouseButtonUp
Signal
​

  • Fires when a mouse button is released on the Frame.

Parameters:

  • position
    Vector2
    — mouse position relative to the window
  • buttons
    table
    — mouse buttons state
    • Table containing mouse button states:
      • left — Left mouse button state.
      • middle — Middle mouse button state.
      • right — Right mouse button state.
      • control — Control key state.
      • shift — Shift key state.

(Frame).MouseWheel
Signal
​

  • Fires when the mouse wheel is scrolled while hovering over the Frame.

Parameters:

  • delta
    number
    — scroll amount

(Frame).MouseLeave
Signal
​

  • Fires when the mouse leaves the Frame area.

Parameters:

  • position
    Vector2
    — last mouse position before leaving
  • buttons
    table
    — mouse buttons state
    • Table containing mouse button states:
      • left — Left mouse button state.
      • middle — Middle mouse button state.
      • right — Right mouse button state.
      • control — Control key state.
      • shift — Shift key state.

(Frame).Shown
Signal
​

  • Fires when the Frame becomes visible.

(Frame).Hidden
Signal
​

  • Fires when the Frame is hidden.

(Frame).Destroyed
Signal
​

  • Fires when the Frame is destroyed.

Example​

local frame = Frame.new(RenderSurface, {
    position = UDim2.new(0, 50, 0, 50),
    size = UDim2.new(0, 200, 0, 150),
    bgcolor = Color.fromRGBA(30, 30, 30, 255),
    borderRadius = 8,
    visible = true,
    zIndex = 1,
})

frame.MouseButton1Click:Connect(function(p)
    print("Frame clicked at:", p.x, p.y)
end)

Notes​

  • absolute is read-only and should only be used for layout checks.
  • First argument of Frame.new() should be an instance of RenderSurface,it's not the parent of the frame. You must set parent in FrameProperties.