gooey: a simple, sprite-based Gamemaker UI library

Hi, the UITextBox doesn't work for me. The caret is always shown in the top left corner of the sprite, also the text . I'm using the latest GM and gooey version 2024.1. I was able to position place holder text (which should be "Hello world" in the screenshot) with fa_left to make it readable, the caret still appears at the top left corner and the input behaves like it's fa_center'ed.

Am I'm doing something wrong? I tried to find a solution in the docs, but wasn't successfull.

Are there downloadable docs or just online?

Sharing another snippet of something I had to kinda of workaround.

I have a couple UIPanel widgets that I add as children to a grid. Upon closing the room I call a function to remove all widgets that are 'bound' to the room. Sadly panels that are parented to a Grid don't fully delete themselves. I had to use this workaround to get them to completely delete:

if (_widget.getType() == UI_TYPE.PANEL) {
    _widget.__parent.remove(_widget.getID());
    UI.__destroy_widget(_widget);
}
_widget.destroy()

Full snippet for the logic to register and later remove widgets when the room ends:

global.widgets_to_remove = []
// Registers a widget that will be removed when the room ends
function widget_bound_to_room(_widget)
{
    array_push(global.widgets_to_remove, _widget)    
    return _widget
}
// Called on room end to remove bound widgets
function widgets_remove_room_bound()
{
    for (var _i = array_length(global.widgets_to_remove) - 1; _i >= 0; _i--) {
        var _widget = array_pop(global.widgets_to_remove)
        
        custom_event_call("widget_removing_room_bound", {
            widget_to_remove: _widget    
        });
        
        // Workaround for panels not removing correctly
        if (_widget.getType() == UI_TYPE.PANEL) {
            _widget.__parent.remove(_widget.getID());
            UI.__destroy_widget(_widget);
        }
        
        _widget.destroy()
    }
}

To use it:

1. When creating widgets call widget_bound_to_room on it, e.g:

var _crafting_group = widget_bound_to_room(new UIGroup("CraftingGroup", 0, 0, 250, 0, spr_back, UI_RELATIVE_TO.MIDDLE_CENTER))
_crafting_group.setInheritHeight(true)
_crafting_group.add(widget_bound_to_room(new UIPanel("ParentedPanel", _x, _y, _width, _height, spr_frame_simple)))

2. When the room ends call:

widgets_remove_room_bound();

Thanks so much for sharing this awesome UI framework for free. Saves me a ton of work and it functions intuitively and is quite stable.

One thing I want to share is that it seems UIGrid.scroll doesn't move the children in cells. The cell groups themselves move (I can see that with setShowGridOverlay), but the children stay where they are initially placed.

For others struggling with this: I've made this (temporary) workaround that hotfixes the problem. Call it on the grid you want to scroll with the same parameters you would give to the .scroll method:

function ui_grid_scroll(_ui_grid, _orientation = UI_ORIENTATION.HORIZONTAL, _sign = 1, _amount = UI_SCROLL_SPEED)
{
    // Just this scrolls the cell groups, but their children aren't updated. BUG?
    _ui_grid.scroll(_orientation, _sign, _amount)
    
    // HOTFIX that triggers the children to update to their correct position
    var _children = _ui_grid.getChildren()
    
    for (var _i = 0; _i < array_length(_children); _i++) {
        var _child = _children[_i]
        
        _child.scroll(_orientation, _sign, 0)
    }    
}

Hey, it looks like the documentation site is down. Any chance you could get it back up? Thank you!

hi, was just trying to find a simple method for returning co-ords for anything a panel, widget etc. Found my way through browsing functions to work out that __dimensions works fine, just checking is the docs suppose to say __dimensions instead of __UIDimensions?

question: So I'm creating an upgrade button and i want a button sprite but also the sprite of the object ontop.

I did something like this:
vehicle_upgrade_image = vehicle_upgrade.add(new UISprite("VehicleUpgradeImage", 0, -8, _sprite, , , , UI_RELATIVE_TO.MIDDLE_CENTER));

works great.. However i cant click on the button while mousing over the sprite.

What's the most optimal way of doing this, I may investigate the UIGroup widget but just wondering if there is a hidden method that is like click-through but for other ui components

also sorry for spamming ur itch comments HAHAH, much love for the support this library is awesome

so turns out i was dumb and i figured it out on stream!

-- Question? Rows should go horizontally no? This is how i know them from spreadsheets.. However idk if its a bug or if you set it up this way. Rows go vertically and collums at the moment go horizontally.

If you could clarify if this is intentional that would be great :)

slowly making progress figuring it out thanks for the hard work and speedy replies <3

___________________________________________

############################################################################################

ERROR in

action number 1

of Draw Event

for object object_ui:

Unable to find instance for object index -4

 at gml_Script_anon_UIGrid_gml_GlobalScript_scr_gooey_Widgets_225168_UIGrid_gml_GlobalScript_scr_gooey_Widgets (line 4398) -                                                  _widget.setDimensions(_x, _y, _w, _h);

############################################################################################

gml_Script_anon_UIGrid_gml_GlobalScript_scr_gooey_Widgets_225168_UIGrid_gml_GlobalScript_scr_gooey_Widgets (line 4398)

gml_Script_anon___UIWidget_gml_GlobalScript_scr_gooey_Widgets_278126___UIWidget_gml_GlobalScript_scr_gooey_Widgets (line 5319) -                                           _id.__updateGridDimensions();

gml_Script_anon_gml_Object_object_ui_Create_0_124_gml_Object_object_ui_Create_0 (line 11) -        var _grid_meta = _panel.add(new UIGrid("MetaGrid", 2, 1));

gml_Object_object_ui_Draw_0 (line 54) -               self.draw_inventory();       

___________________________________________

I randomly get this bug around grid usage by the way. I'm sure it's because I haven't implimented them correctly but thought you should know.

// Create grid with two rows, one column and 80%-20% proportions (upper part will be the inventory and lower part the description)

var _grid_meta = _panel.add(new UIGrid("MetaGrid", 2, 1));

_grid_meta.setRowProportions([0.8,0.2]).setMarginTop(_panel.getDragBarHeight());

-- This is what I wrote around grids

it would be really awesome if there was more info or tutorials on using the library. Do you plan to make a few more videos?

For example I'm thinking how to use it to build a inventory, I'm playing around with the UIGrid but yeah I think if there was a tutorial that went over how widgets link up more or what they are used for will help.

I appriciate the docs and the current video that is up.

oh side note https://biyectivo.com/gooey/doc_scr_UI_Widgets.gml.html#UIButton the docs are bugged you cant view the whole page as the sidebar cuts it off :c

YO, amazing work. I praise this so hard, im going to implement it into my game as

Odd Nite(wurmhole) said, I'm just getting into UI for my project and i was just browsing for any libraries to reference but this has allot of great infostructure.

I appreciate the hard work with this library thank you so much for your efforts 

You are a Saint. This comes right as I’ve started work on the UI of my project!