How to Load a view inside a Tab or PagedTabs?

Flow
1

I Would like to Know how to Load a Class View inside a Tab ou PagedTabs.

2

Please provide more information.

3

Hi Jonas! Thanks for your attention!

I have 3 different views, like Customer Orders, Customer Histories, Customer Subscriptions. I would like to create Tabs with 3 tabs and load a corresponding view in each tab.

I try something like this, but with no success. When I click in one tab the navigation happens but not inside a Tab.

private Tabs tabList; 
private Tab tabOrder	       = new Tab("Order");
private Tab tabHistory	       = new Tab("History");
private Tab tabSubscription    = new Tab("Subscription");
private Map<Tab, Class> tabMap = new HashMap();

@SuppressWarnings({ "unchecked" })
private void changeTabs() {		
	
	tabMap.put(tabOrder, View1.class);
	tabMap.put(tabHistory, View2.class);
	tabMap.put(tabSubscription, View3.class);
	
	tabList = new Tabs(tabOrder,tabHistory,tabSubscription);
	tabList.setOrientation(Orientation.HORIZONTAL);
	tabList.addSelectedChangeListener(event -> {
	    UI.getCurrent().navigate(tabMap.get(event.getSelectedTab()));
	});
	this.add(tabList); 
}

Maybe there was other way to do this.

I am using spring in the views with dependency injection to Services.

Thanks.

4

I found this solution with PagedTabs:

private PagedTabs pagedTabs = new PagedTabs();
private Tab tabOrder	= new Tab("Order");
private Tab tabHistory	= new Tab("History");
private Tab tabSubscription = new Tab("Subscription");

private void createPagedTabs() {
	View1 view1 = new View1();
	View2 view2 = new View2();
	View3 view3 = new View3();	
	
	pagedTabs.add(view1, tabOrder);
	pagedTabs.add(view2, tabHistory);
	pagedTabs.add(view3, tabSubscription);
	this.add(pagedTabs);
}

It works for me!