Directory

← Back

paged-tabs

A tabsheet component with multiple tabs that automatically show the page content when a tab is clicked

Author

Rating

Popularity

200+

The current Vaadin's Tabs component doesn't include an API to show a Component when a tab is clicked. You have to code the logic to show and hide components depending on the selected tab. This component frees you from implementing such logic. Here's an example:

VerticalLayout container = new VerticalLayout();
PagedTabs tabs = new PagedTabs(container);
tabs.add("Tab caption 1", component1);
tabs.add("Tab caption 2", component2);
layout.add(tabs, container);

Make a tab non-closable as follows:

tabs.add("Closable", new Span("Close me"), false);

Get a Tab reference:

Tab tab = tabs.add("Tab caption", component);

Add a selection listener:

tabs.addSelectedChangeListener(selectedTab -> {
    ...
});

Set a close listener:

tabs.setCloseListener(closableTab, closedTab -> {
    ...
});

Get text by Tab (captions must be unique):

String textOnTab = tabs.getText(tab);

Get Tab by text:

Tab tab = tabs.getTab("Tab caption");

Get Component by tab:

Component component = tabs.getComponent(tab);

Close a tab:

tabs.close(tab);

Select a tab:

tabs.select(tab);

Get selected tab:

Tab tab = tabs.getSelectedTab();

Count tabs:

int count = tabs.count();

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

Upgrade to Vaadin 24.4.1 #35 (thanks Károly Kótay-Szabó).

Released
2024-09-18
Maturity
STABLE
License
Apache License 2.0

Compatibility

Framework
Vaadin 24.4+
Vaadin 10 in 1.0.0
Vaadin 13 in 1.2.0
Vaadin 14+ in 2.0.0
Browser
N/A

paged-tabs - Vaadin Add-on Directory

A tabsheet component with multiple tabs that automatically show the page content when a tab is clicked paged-tabs - Vaadin Add-on Directory
The current Vaadin's `Tabs` component doesn't include an API to show a `Component` when a tab is clicked. You have to code the logic to show and hide components depending on the selected tab. This component frees you from implementing such logic. Here's an example: ```Java VerticalLayout container = new VerticalLayout(); PagedTabs tabs = new PagedTabs(container); tabs.add("Tab caption 1", component1); tabs.add("Tab caption 2", component2); layout.add(tabs, container); ``` Make a tab non-closable as follows: ```Java tabs.add("Closable", new Span("Close me"), false); ``` Get a `Tab` reference: ```Java Tab tab = tabs.add("Tab caption", component); ``` Add a selection listener: ```Java tabs.addSelectedChangeListener(selectedTab -> { ... }); ``` Set a close listener: ```java tabs.setCloseListener(closableTab, closedTab -> { ... }); ``` Get text by `Tab` (captions must be unique): ```java String textOnTab = tabs.getText(tab); ``` Get `Tab` by text: ```java Tab tab = tabs.getTab("Tab caption"); ``` Get `Component` by tab: ```java Component component = tabs.getComponent(tab); ``` Close a tab: ```java tabs.close(tab); ``` Select a tab: ```java tabs.select(tab); ``` Get selected tab: ```java Tab tab = tabs.getSelectedTab(); ``` Count tabs: ```java int count = tabs.count(); ```
Source code

paged-tabs version 1.0.0

paged-tabs version 1.0.1
Fixed wrapper size.

paged-tabs version 1.0.2
Bug fixes.

paged-tabs version 1.1.0
Added support for custom tab content suppliers.

paged-tabs version 1.1.1
Fixes NPE when used with Vaadin 10.0.5.

paged-tabs version 1.1.2
Added tab close listener. Requieres Vaadin 10.0.6 or later.

paged-tabs version 1.2.0
Updated to Vaadin 13. Fixed select method.

paged-tabs version 2.0.0
Updated to Vaadin 14.0.2

paged-tabs version 2.0.1

paged-tabs version 3.0.0
New API

paged-tabs version 4.0.0
Upgrade to Vaadin 24.4.1 #35 (thanks Károly Kótay-Szabó).

Online