How to make horizontal separation between tabs on TabContainer?

0 votes

in Custom Constants HSeperation doesn't work :(

in Engine by (90 points)

1 Answer

0 votes

That's because hseperation is the distance between the text and icon of a tab, see this issue. If you want to create gaps between the tabs you've to edit the theme:

  1. Select the TabContainer and search the property inspector for "Theme"
  2. Choose "Create New Theme" and a new window at the bottom will open
  3. In that window, choose Edit Theme > Add Class Items > TabContainer
  4. Back in the inspector, unfold Tab Container > Styles
  5. Choose New StyleBoxFlat for "Tab Bg"
  6. Now change Border Width > Left / Right, e.g. to 100
  7. Then set Border > Color to fully transparent (i.e. the A(lpha)-value to 0)
  8. For more inner space, change Expand Margin > Left / Right
  9. Repeat steps 5-8 with "Tab Disabled" and "Tab Fg"
by (10,469 points)

What if you want a border though? I'm creating tabs that have a gray border around them, and this answer gets rid of the borders entirely.

by (12 points)
Welcome to Godot Engine Q&A, where you can ask questions and receive answers from other members of the community.

Please make sure to read How to use this Q&A? before posting your first questions.
Social login is currently unavailable. If you've previously logged in with a Facebook or GitHub account, use the I forgot my password link in the login box to set a password for your account. If you still can't access your account, send an email to webmaster@godotengine.org with your username.