Vaadin 14 AppLayout and RouterLayout

I’m trying to get v2.0.0 of the AppLayout working with a RouterLayout.

I’ve tried adding the Applayout to the parent RouterLayout and the other way around but neither seem to work.

It looks like the api to AppLayout had a radical change between 13 and 14 but I can’t find any doco on how to use it.

ublic class MainAdminLayout extends VerticalLayout
		implements RouterLayout
	public MainAdminLayout()
		AppLayout appLayout = new AppLayout();
		appLayout.addToDrawer(new CustomerListView());
		appLayout.addToDrawer(new UserListView());

@Route(value = "", layout = MainAdminLayout.class)
public class CustomerListView extends BaseListView<Customer>

The two classes seem to be fighting with each other. The router layout tries to display the CustomerListView (as this is the default Route) and the appLayout overlays a second copy of the CustomerListView.

Additionally I’m expecting some type of hamburger menu (or similar) to change the view that I’m looking at but no such item appears.

If almost feels like these two components were not designed to work together?


OK, so I eventually worked it out.

The clue is that AppLayout is actually a RouterLayout.

The main examples for AppLayout are inconsistent with the rest of the doco on using RouterLayout (and a particulary a parent RouterLayout).

So for the record you want something like this:

public class MainAdminLayout extends AppLayout

	public MainAdminLayout()
		VerticalLayout drawLayout = new VerticalLayout();
		drawLayout.add(routeLink("Customer" , CustomerListView.class));
		drawLayout.add(routeLink("User" , UserListView.class));
	private RouterLink routeLink(String label, Class<? extends Component> clazz)
		return new RouterLink(label, clazz);

@Route(value = "CustomerList", layout = MainAdminLayout.class)
public class CustomerListView extends VerticalLayout