OptionButton improvements regarding per-item text and icons.

[Hatchet2k4]

Using Godot 4.2.1. I am building a game that would allow players to select teams by color. I was hoping to use an OptionButton for this, and have each row's text match its color. Essentially turning this:

Into my mockup here:

Unfortunately there is no clear way to do this. I propose being able to have an option for each item's text to have individual themes/font properties that can be set, ie color, font, size, etc.

I tried to work around this by creating icons for each team instead. However, I found that Godot didn't handle mixing rows that are just icons and just text very well:

I also tested with various icon sizes, essentially it is pushing the text to the right to match the width of the widest icon. If a row has text but no icon, I don't believe it should be pushed to the right as if it did have one. This could be resolved in a non-breaking way by having an option for icons to appear to the right of any text instead, so a row with text but no icon should still have text left aligned, and a row with an icon but no text would have the icon left aligned.

[Calinou]

I tried to work around this by creating icons for each team instead. However, I found that Godot didn't handle mixing rows that are just icons and just text very well:

My suggestion here would be to use smaller icons with a square aspect ratio, and use a "crossed square" icon with a transparent background for the None option. See what Inkscape does in the bottom-left corner of its UI:

Here's a mockup:

[Hatchet2k4]

Yeah I ended up doing something like that. But I thought it was worth bringing up for discussion/potential improvements regardless.

[Mickeon]

I propose being able to have an option for each item's text to have individual themes/font properties that can be set, ie color, font, size, etc.

While I would love this, I'd be wary because then one would have to question how far to take all of that modularity. Color, font, size... then one may then suggest styleboxes, underlines, checkbox texture overrides...

I know it's not pretty, but have you tried a more ad-hoc solution with CanvasItem's draw_string()?

[Hatchet2k4]

I would think it could just be limited to what is already supported in Themes. In any case I used icons with standard text. I suppose I could try using draw_string too.

[BreakRyo]

one easy way to achieve that is instead of using label's as items they could use a richtextlabel with BBCode enabled by default.

[Calinou]

OptionButton doesn't use Label nodes internally – it draws text using the CanvasItem draw_string() method. Reducing the number of internal nodes avoids overhead for OptionButtons that have lots of options.