TabbedComponent with custom TabBar?

General JUCE discussion
1

Hi,

I want to create a TabbedComponent with a customer layout for the TabbedButtonBar.

I want the first button to be left aligned. But all other buttons should be right aligned. In other words: there should be a gap in the middle, between TabButton1 and the other tab buttons.

Any suggestions how to achieve that?
I think, I would need my own TabbedButtonBar, to do the custom layouting. Unfortunately, the TabbedComponent is not designed for that, it seems.

I can create my own TabBarButton. The TabbedComponent class lets me do that with the function “createTabButton(https://docs.juce.com/master/classTabbedComponent.html#af6d13ea3c6b9dc73ffc8dea8d74099da)”
But I cannot create my own TabbedButtonBar, because there is no corresponding function “createTabButtonBar”.

2

You’ll need to create a custom LookAndFeel and implement the TabbedButtonBar::LookAndFeelMethods here.

3

Hi Ed,

thanks for the fast answer.
You have to help me out here: How would I achieve my goal, using the LookAndFeel methods?

I think I would need to change the placement of the TabButtons. But I don’t think the Look And Feel methods let you do that?
I guess I could do a hack with “getTabButtonBestWidth” by making the first button much larger than it needs to be. But other from that?

Or probably I am just blind and not seeing the obvious? :slight_smile:

4

Yeah that could work, or you could override drawTabButton() to draw the first button with the desired space on the right-hand side. Both of those methods pass you a reference to the TabBarButton in the argument list so it should be quite easy to determine which button is the first.

5

Thanks, Ed.
I’ll try that.