Vaadin 23 add the common part of several Views into content part of AppLayout

Question

I have MainLayout defined (extended from AppLayout), where I have configured Header and Drawer. Also, I have 3 different views which use MainLayout via @Route annotation.

There is some similarity between such 3 views - they have the common tabs at the top of the content area. Is it possible somehow to add such tabs into MainLayout content area? Or inside of AppLayout I may only add something to Header and Drawer only? How to properly implement such common tabs for these 3 views ? Right now I added duplicates of these tabs into each of the view and they don't work as expected(incorrect highlighting of selected tab). How to make them common for 3 views ?

You can use multiple parent layouts. See the official documentation for an example https://vaadin.com/docs/latest/routing/layout/#multiple-parent-layouts — Knoobie, Jul 26 '22 at 20:38
Can you please add an answer how you solved it? This may be helpful for others — Simon Martinelli, Jul 27 '22 at 07:14

score 0 · Answer 1 · answered Jul 27 '22 at 08:38

0

I created one more layout class with @ParentLayout(MainLayout.class) annotation and derived from VerticalLayout implements RouterLayout. Inside this layout I added my tabs. Now, for each of the mentioned in the question views, I use this new Layout.

answered Jul 27 '22 at 08:38

alexanoid

24,051
54
210
410

Vaadin 23 add the common part of several Views into content part of AppLayout

1 Answers1