WGui

UI

WGui is a Nanos World package designed to simplify and improve Widget support.

The package is not in its final version. Bugs and issues may occur.

Components

Components in WGui are similar to what HTML elements are in a webpage.

These include things like buttons, checkboxes, sliders, text, inputs, etc. Each component has a set of properties that determine its appareance and behavior.

The method for creating Components (but also Panels) is WGui.Create(). This method takes two parameters: the Identifier of the Element to create and an optional parent to which the Element gets added.

Here's an example of creating a button with a text and adding it to a Canvas:

local canvas = WGui.Create("NCanvas")

local button = WGui.Create("NButton", canvas)
WGui.Create("NText", button):SetText("Hello World!"):SetFontSize(13)

Panels

Panels in WGui are containers for components. They help in organizing, grouping and positioning components within the UI. A panel can contain multiple components, and even other panels, allowing you to create a complex and nested UI structure.

Slots

Slots in WGui, similar to Unreal Engine UMG, refer to the locations within a Panel where Components are placed. However, unlike in UMG where slots are explicit objects, in WGui, slots are a conceptual part of a Panel and their methods are directly added to the Components once they are added in a Panel.

Slots are responsible for the positioning and size of Components within a Panel but also other properties. Each type of Panel in WGui automatically provides a corresponding set of Slot properties that can be used. For instance, a GridPanel will provide GridSlot properties, a VerticalBox will provide VerticalBoxSlot properties, and so on.

Here's an example of how Slots are used in WGui with a GridPanel:

local UniformGridPanel = WGui.Create("NUniformGrid", WGui.Create("NCanvas"))
UniformGridPanel:SetSize(Vector2D(500, 500)) -- Method from CanvasPanelSlot

for i = 1, 10 do
    for j = 1, 10 do
        local Image = WGui.Create("NImage")

        UniformGridPanel:Add(Image)
        Image:SetRow(i) -- Method from UniformGridSlot
        Image:SetColumn(j) -- Method from UniformGridSlot
    end
end