All TabItems should be in single row in TabPanel

[aonjavadev]

Hi,
If we see example http://www.sencha.com/examples/pages/tabs/advanced.html where we can add tabs, after adding 60tabs the newley added items goes to next row and scroll left and right arrows disappear. I have 120 tabs and want all the tabs to be displyed in single row with scroll left and right arrows visible to scroll between tabs.
Thanks in advanced for the help.

[Colin Alworth]

You can modify the styles that the TabPanel uses to calculate the space allocated for tabs to fix this. Currently, the tabpanel has the following css making space for the tabs:


ul.x-tab-strip {
display: block; width: 7000px; zoom: 1; }

In your own css, add something like this to increase the space for the tabs. Make sure this css loads after gxt-all.css


ul.x-tab-strip {
width: 21000px;
}

This will let you grow to about 180 tabs before wrapping - increase the width if you need more.

This is not deliberately done already, as it makes it very difficult to find other tabs when you have more than a few dozen. The purpose of a tab panel is to hide some content while still allowing the user to know it is there - this becomes quite difficult to use when you don't have a way to search or to even know which direction to look in.