Extremely Important Note: The editor ui is broken in this version - I’m currently remaking the editor in Roact (plugin will be updated as soon as this is done - eta ~march 16th)
After becoming very tired of hardcoding gui element inputs in Roblox games, I decided to create a plugin to tie the gui design process and input programming together. The result is GuiBuilder.
What does it do?
GuiBuilder allows for predefined “GuiActions” to be bound to any input event of any gui element. A GuiAction consists of an arbitrary number of parameters (instances, strings, numbers, etc.) as well as a function to be called when the event is fired. GuiActions can easily be added or changed.
The following frame’s MouseEnter event has been assigned a SetBackgroundColor3 action:
When the player’s mouse enters the frame, its color will be set to black.
How do I use it?
Get the plugin here. GuiBuilder will generate a folder called GuiBuilder under ReplicatedStorage which contains a ModuleScript called GuiBuilderClientMain - this module must be required by a LocalScript on the client for the events to be successfully connected. GuiBuilder now requires this module on the client automatically. This behavior can be disabled in the settings menu
GuiBuilder is designed for ease of creation of new types of GuiActions; this can be done by editing the GuiActionInfo module. The idiom for defining new GuiActions is fairly simple and can be found in the README on this project’s GitHub repository. GuiActions necessitating external dependencies can simply require the needed module within its associated function call. A freshly edited GuiActionInfo module can be hot-swapped into a running GuiBuilder instance using the “Refresh GuiActions” button.
The future of GuiBuilder
I will be supporting this plugin for an indefinite period of time, so if it isn’t immediately useful to you now, it may be in the near future
for gui elements to be interact-able, their input events have to be connected to functions. typically, the code for this looks something like the following:
-- do something
without this plugin, this code (or similar) needs to be manually written for every element that needs to be inter-actable. GuiBuilder makes it so you don’t have to do this with code; rather, it can be done using the GuiBuilder interface.