Open Poobslag opened 2 months ago
Kenney's UI pack: https://kenney.nl/assets/ui-pack
Instant better UI with Godot 4's Theme Editor: https://www.youtube.com/watch?v=jIk-OG5hG3k (Godot 4)
After exploring different options for the UI, I think rounded rectangles using "StyleBoxFlat" is the best approach.
I tried implementing textured buttons with "StyleBoxTexture". However, Godot 3.x does not support upscaled textures (having a 512x512 px image for a 120x30 px button). Since the game's resolution is currently 1024x600, this means anybody playing the game at fullscreen would see pixellated/blurry textures. This may still work OK if we end up wanting simple gradients, but it doesn't look good for the kinds of textures in the Puyo Puyo screenshot above.
We could also work around any kind of shortcomings in Godot's UI (such as the "upscaled texture" problem) by implementing our own UI nodes, but this is too much work for now and I'd rather use Godot's built in UI nodes.
The built-in "StyleBoxFlat" approach is OK but still does not work if we want icons alongside text, which feels like something pretty basic we'd want. While Godot buttons do support icons and text, sort of, the icon size is arbitrary, and the amount of space between the icon and text is arbitrary too. Getting things to align or look good will require a tremendous effort and possibly involve weird kludges like padding our text or images with whitespace.
A better approach seems to be to implement our own customized Button node which will have child panels, labels and texturerects which can draw however we like. This should also allow us to work around the issues mentioned in the previous comment, as far as not being able to use background textures because there is no way to upscale textures.
The UI currently uses Godot's default grey buttons.
We should come up with a more fun, colorful theme.
Ideally something colorful with big thick fun borders and little icons.