How to resize the Tabs themselves, inside a TabContainer?

This is a READ-ONLY snapshot of the Godot Community Forums when TwistedTwigleg was the owner, which is hosted for archival reasons only. The current Godot Community Forums can be found here.

Some links may point to external websites, including the current Godot Community Forums. These websites are not associated with TwistedTwigleg.

How to resize the Tabs themselves, inside a TabContainer?

Crawfish

Given:

I'd like to resize the actual Tab buttons, make them both wider and taller, by about 50%. I've looked at changing the Rect, which does not appear to affect the visible aspect when running, and all the other properties. Searching for it, I've found things like How to Resize Tab Button, which sounded promising - but searching Help for "Custom Style" didn't turn up anything. Nor did any other search-results help. Thanks.

DaveTheCoder

Themes and styles are covered in this part of the documentation. I've used it a little, but am not an expert on it.
https://docs.godotengine.org/en/stable/tutorials/ui/gui_skinning.html

Crawfish

DaveTheCoder Thanks, however I have read that, and most of the theme/customization pages. That page, for instance, does not mention setting the Size of elements - only Color/Font/Icon, and Stylebox, which also doesn't seem to include Size as an option. Unless there's something I'm missing?

DaveTheCoder

It's possible that a TabContainer is not designed to be customized the way that you want.

duane

The size of the tab is controlled by the text, the size of the font associated with the tab, and the size of the content margin of the stylebox associated with the tab, which sets the space around it. These can be changed if you create a custom theme for your control (or your project) with the theme editor. As far as I can tell, you can't set tabs to be Y width, because they have to be able to accommodate different text. You can't set them to 2x width without scripting them (as in the question you linked), but you can set the font or margins larger. You can make the active tab different from the background tabs as well.

Crawfish

duane Thanks for the information. I'm still not entirely clear on what is possible with tabs - it sounds like something like this, isn't?

Those are obviously not tabs. 🙂 They are Buttons that I'm experimenting with (and even those, I don't seem to have the degree of control over aspects, that I would have liked).

As for the scripting mentioned, my basic reading of it, it seems like it references properties that exist on the Tabs, which I don't understand why they couldn't be set in the Editor then? Is something "magic" happening, like a higher Container, is doing things to the Tabs, that the Editor can't change, but code can?

duane

Crawfish

The only problem with your mock-up is that you can't make the theme treat each tab differently (if that's what you meant) -- apart from active and background tabs being different. You might be able to script that, but I doubt it. I think you'd need a custom control.

Crawfish why they couldn't be set in the Editor then?

You'll notice that the script in your link isn't actually changing the tab properties, it's only adding space around the title to simulate changing the margins. It can't make the tabs taller, for example.

Crawfish

duane ah yeah, that was mainly an experiment, I wasn't looking for the tabs to be individually-different - just tweakable. So I'm still not clear if you can manipulate the tab properties can be modified themselves, not just by making the Text larger, but it's sounding like a negative. 🙂 If you resized the Text, wouldn't each tab then be a different size, based on word-length? Or could you space-pad it, I guess?

Update: using a custom theme/Font, etc, (and adding spacing-chars to the tab-name), was able to add more padding around the text, and make the Tabs larger. That's what you originally described, and with the spacing-chars, it seems to mostly work. (having said that, now I'm wondering if it could be padded left/right, individually, so I don't need the spacers - off to experiment).