Add tab dynamically using a tab item in GWT

Question

I want to create a tabbed page and load different information on each tab click.

I want to be able to add tabs dynamically when clicked the '+' tab.

So, on clicking '+' a new tab should be added to the same tabLayoutPanel.

Any suggestions on how to do it in GWT.

Thanks.

Answer 1

• Add the '+' tab statically (e.g. ui xml).
• Add a selection handler (see In GWT how do I handle the tab click event? for how to do this).
• In this handler: if the last tab is selected, insert a new tab just before it and select it from code.

Answer 2

You can also add to the tabPanel an empty + widget, then add a selectionChangeHandler on the tabPanel to detect click on the + tab, which add your new tab and select it.

So the +tab do the job and is never shown:

    tabPanel.add(new Label(), "+");

    tabPanel.addSelectionHandler(new SelectionHandler<Integer>() {

        @Override
        public void onSelection(SelectionEvent<Integer> event) {
            if (event.getSelectedItem() == tabPanel.getWidgetCount() - 1) {                 
                Widget w = new Label(); // the widget which contains the new tab
                tabPanel.insert(w, w.toString(),
                        tabPanel.getWidgetCount() - 1);
                tabPanel.selectTab(w);
            }
        }
    });