S&box Wiki

UI/Components

Components

There are a few basic components that you can use in your game.

Panel

API Reference: Sandbox.UI.Panel

Panels are the basic building blocks for UI elements. All of the elements below derive from this class. A panel can render, as well as handle events and input, making them very versatile.

<div> @* Put stuff here *@ </div>

Label

API Reference: Sandbox.UI.Label

The Label component is used to display text.

<label>Hello, World!</label>

Button

API Reference: Sandbox.UI.Button

Users can click these to invoke an action. These have text, and can optionally have an icon.

<button @onclick=MyFunction>Click me!</button>

Checkbox

API Reference: Sandbox.UI.Checkbox

A Checkbox allows the user to select one or more items from a set. It is ideal for situations where multiple choices are allowed, and it doesn't take up much room.

<checkbox Value:bind=@CheckboxValue>This is a checkbox</checkbox>

Image

API Reference: Sandbox.UI.Image

The Image component is used to display a graphic.

<img src="/ui/my_cool_image.png"></image>

TextEntry

API Reference: Sandbox.UI.TextEntry

TextEntry components are used for input fields that allow users to enter text.

<textentry @onchange=OnTextChange></textentry>

WebPanel

API Reference: Sandbox.UI.WebPanel

A WebPanel is used to display web content in your game. This can include HTML content or even whole websites.