setTabBarControls on TabSet

[stonebranch2]

Hi Isomorphic,

We have some buttons that we add to the tab bar controls, and wanted to add some spacing around the buttons.

I've created a mockup below.

            Button button1 = new Button("Add");
            button1.setAlign(Alignment.CENTER);
            button1.setMinWidth(100);
            Button button2 = new Button("Remove");
            button2.setAlign(Alignment.CENTER);
            button2.setMinWidth(100);
            TabSet ts = new TabSet();
            ts.setWidth100();
            ts.setHeight100();
            ts.setTabs(new Tab("Tab one"));
            HLayout hLayout = new HLayout();
            hLayout.setMembers(button1, button2);
            hLayout.setLayoutTopMargin(2);
            hLayout.setLayoutBottomMargin(0);
            hLayout.setLayoutLeftMargin(5);
            hLayout.setMembersMargin(5);
            ts.setTabBarControls(TabBarControls.TAB_SCROLLER, TabBarControls.TAB_PICKER, hLayout);
            ts.setTabBarPosition(Side.BOTTOM);
            Layout l = new VLayout();
            l.setWidth(500);
            l.setHeight(500);
            l.addMember(ts);
            l.show();

The problem is, the additional height isn't taken into consideration, so it ends up clipping the buttons along the bottom.



We have worked around this by setting the setTabBarThickness to a certain height to accommodate.

Is there a way to get it to draw without clipping the buttons and without using setTabBarThickness?

Thank you

[Isomorphic]

Right, you do need to setTabBarThickness if you want to make the tab bar thicker to accommodate larger controls. We're not sure how else this could work or what you expected to happen instead?

[stonebranch2]

We expected the strip along the bottom holding the tab bar controls to expand to fit the button layout, without clipping. This would mean the whitespace directly below the tab bar(s) would increase in height accordingly.

We were not trying to introduce larger controls, only trying to provide a more spacious look and feel without the buttons being flush with the tab above them. The tab bars are flush, which obviously makes sense, but it would be nice to define a gap between our buttons and the tab.

Thanks

[Isomorphic]

If the tabBar were to auto-size to tabBarControls, that would mean that the paneContainer (main tab area) would need to be shrunk. Any such behavior is very expensive as you're either doing some extra offscreen drawing to determine sizes, or you end up resizing the entire contents of the tab once it's been drawn.

In a nutshell, you're expected to set tabBarThickness because otherwise things would be much slower.

[stonebranch2]

Thank you for the reasoning.

In my case, I am trying to create the gap via my "custom" tab bar control that I add. What if we were able to specify such a gap as a tab bar control attribute, so the tiny gap could be accounted for upfront.

[Isomorphic]

Gap where?

Did you notice that tabBarControlLayout is an AutoChild of type Layout? Via all the usual layout properties (layoutMargin, membersMargin, layoutAlign, etc), you can create any gap or placement you want.

[stonebranch2]

No, I did not notice. Thank you!