paged-tabs in Flow?

Flow
8

Yes - the project now builds successfully and runs well. Thanks Alejandro.

9

Good to hear. Enjoy the book!

10 
	PagedTabs tabs = new PagedTabs();		
	WeekliesView weekliesview = new WeekliesView();  // VerticalLayout with grid
	SermonsView sermonsview = new SermonsView();     // VerticalLayout with grid

	Tab tabweeklies = new Tab();
	Button btnweeklies = new Button("Weeklies");		
	btnweeklies.setIcon(new Icon(VaadinIcon.OPEN_BOOK));
	tabweeklies.add(btnweeklies);		
	tabs.add(weekliesview, tabweeklies);
	
	Tab tabsermons = new Tab();
	Button btnsermons = new Button("Sermons");
	btnsermons.setIcon(new Icon(VaadinIcon.HEADPHONES));
	tabsermons.add(btnsermons);

	tabs.add(sermonsview, tabsermons);
11

P Tan, I wasn’t able to reproduce the issue. My guess is that the problem might be related to how you are composing the content of the tabs. Can you share a minimal runnable project to reproduce the problem?

12

The tabs were originally working after the component .jar was added for Maven, however once I added a login screen to the project, I am also now experiencing the same problem as P Tan.

Did anyone get to the bottom of that? I currently only have a project utilizing a database… if need be, I can try to create a minimal runnable project.

13

Darren B. Please do share a minimal runnable project and I’ll have a look at the issue.

14

Alejandro - I’ve got a runnable project to demonstrate the issue. How would you like that shared?

15

Thanks! An attached file here should work.

16

Here it is.
17229632.zip (70 KB)

17

Darren, it seems the file is corrupted. Can you please attach it again? (make sure you don’t include compiled code by running mvn clean before creating the zip file).

18

Trying it again
17233579.zip (36.9 KB)

19

Cannot download the file.

20

Sorry - was away on vacation… Another attempt - rename file to .zip and it seems to work for me now.
17252600.zap (36.9 KB)

21

Thanks Darren. Version 1.0.2 should fix the bug. Cheers.

22

Thanks Alejandro - Version 1.0.2 works for me.

23

Alejandro - I’d like to ask, is it realistic to use this component if I require 5-8 tabs on the top level, with each top level tab having 2-5 nested tabs? That is essentially like having 10 (or more) ‘pages’ all on one web page, correct? Most of the nested tabs would also contain a grid (for which I’ve not yet figured out lazy loading (using only JDBC)). Thanks.

24

It depends. The relevant technical aspect to know is that all the components in the pages are kept in memory.

25

Darren, I just published version 1.1.0 that allows specifying custom tab content suppliers:

tabs.add(this::getTab1Content, "Tab 1");

In the previous example, the getTab1Content method is called when the “Tab 1” tab is selected. The PagedTabs class no longer keeps references to the content components directly but to the suppliers. Hope that helps!

26

Thanks Alejandro.

I have attempted this, however am having trouble with the double colon operator in this case. Using

tabs.add(this::getContactList, "Contact");

private ContactList getContactList(String sContactType)
{
	return new ContactList(sContactType);
}

The error being:

The target type of this expression must be a functional interface.

Would this achieve the same result?

`tabs.add(getContactList(), "Contact");`

I guess this may be a more general Java question, but appreciate your time.

27

Darren B:
Thanks Alejandro.

I have attempted this, however am having trouble with the double colon operator in this case.

That’s called a “method reference”. You can use a lambda expression instead: tabs.add(() -> getContactList(someParam), "Contact"). Check this out: https://docs.oracle.com/javase/tutorial/java/javaOO/lambdaexpressions.html.