Table of Contents
Widget
A Widget is the base of all GUI objects in JUI. Widgets are organized into a tree hierarchy, where each widget has exactly one parent, and an arbitrary number of children. The Widget is an abstract class, and is not directly constructable. Rather, Widget implements the base code shared between all widget objects that you can construct.
Creating Widgets
auto* scene = new JUI::Scene(); // Scene is also a type of widget.
auto* button = new JUI::Button(); // Button is also a type of widget.
Events
JUI, and our related C++ software, utilize our system for event callbacks and hooks. All widgets share the following events: Focused, Unfocused, DescendantAdded, DescendantRemoved, AncestryChanged, ChildAdded, ChildRemoved, and Destroying.
Syntax for using events is as follows:
// This sample connects a lambda function to Widget::Focused.
myWidget.Focused += [] () {
std::cout << "Focus captured" << std::endl;
};
See our Event library for further information.
Styling Widgets
Widget classes provide getters and setters for their properties.
auto* rect = new JUI::Rect();
rect->Size({50_percent, 25_percent}); // Shortcuts for constructing UDim2 are provided.
rect->BGColor(Colors::Red); // See our mcolor library for color representation.
std::cout << rect->BGColor() << std::endl; // Getters and setters generally will have the same name signature.
auto* label = new JUI::Text(rect);
label->SetContent("Hello, World");
label->SetTextSize(18);
label->SetWordWrap(true);
Animations & Tweening
(Consider making this a separate article.) This section is currently a stub because the JUI animation system is still under early development.
Building Layouts.
(Consider making this a separate article.)
// This sample creates a rectangle with a list of buttons.
auto* btnGroup = new JUI::Rect();
btnGroup->Size({250_px, 250_px});
btnGroup->Color(Colors::Transparent);
auto* layout = new JUI::VerticalListLayout(btnGroup);
for (int i = 0; i < 10; i++) {
auto* btn = new JUI::TextButton(layout);
btn->SetContent("Button " + i);
btn->Size({100_percent, 25_px}); // Assume the width of the parent object, but set height to 25 pixels.
}