We have the requirement of having separate layouts for landscape and portrait orientation. Does Vaadin have any support for this or do we have to use a separate button for this
You could use Page.getCurrent().getWebBrowser() and check the height/width and change layouts accordingly. If you need to change stuff on the fly, register a window resize listener and redo the check there.
Same approach. I’ve used the ticketing sample project as a base, which has the “browserresizeevent” and used is as below at the view I wanted to modify:
@Subscribe
public void browserResized(final BrowserResizeEvent event) {
if (Page.getCurrent().getBrowserWindowWidth() > Page.getCurrent().getBrowserWindowHeight()){
landscapeMode = true;
}else{
landscapeMode = false;
}
formatLayoutEnvironment();
}
private void formatLayoutEnvironment(){
if(landscapeMode){
//Replace the component of the portrait to landscape
//table.setPageLength(10);
mainVerticalLayout.removeComponent(portraitIncident);
mainVerticalLayout.addComponent(landscapeIncident);
}else{
//table.setPageLength(5);
mainVerticalLayout.removeComponent(landscapeIncident);
mainVerticalLayout.addComponent(portraitIncident);
}
}