GXT 3 change tab style (add css)

Question

GXT 3 has a function, which adds a tab to tabpanel

      tabPanel.add(html, new TabItemConfig(title, true));

I have to change style of the name of this tab and also contents. These have no effect:

           tabPanel.setStyleName("tab-title", true);
           html.setStyleName("tab-title", true);

TabItemConfig has no method to change style. How to achieve?...

The solution is to use appearances and styling – Alex A. Renoire Jul 04 '12 at 07:23 — Alex A. Renoire, Jul 04 '12 at 07:23

score 1 · Answer 1 · answered Mar 16 '13 at 12:12

I see you've found the solution, but I just leave it here, because it's quite simple and may save somebody's time:

class StylableTabPanel extends TabPanel {
    public void applyTabStyles(Widget widget, String styles) {
        findItem(getWidgetIndex(widget)).applyStyles(styles);
    }
}

Then:

tabPanel = new StylableTabPanel();
HTML shortText = new HTML("Lorem ipsum...");
tabPanel.add(shortText, "Short Text");
HTML longText = new HTML("<b>lorem ipsum dolor sit amet...</b>");
tabPanel.add(longText, "Long Text");
tabPanel.applyTabStyles(longText, "margin-left: 300px;");

GXT 3 change tab style (add css)

1 Answers1