Put components in the middle of the page

Hello,

I would like to use a VerticalLayout to organize several components in the middle of the page. Here is the code I use :


Window mainWindow = new Window("Hello there");

Label title = new Label("<big><big><big><b>I know this HTML code is very awful</b></big></big></big>", Label.CONTENT_XHTML);

VerticalLayout vertical = new VerticalLayout();

    @Override
    public void init() {
      
        title.setSizeUndefined();    
             
        vertical.setSizeFull();
        vertical.addComponent(title);
        vertical.setComponentAlignment(title, Alignment.MIDDLE_CENTER);

        mainWindow.addComponent(vertical);
	setMainWindow(mainWindow);              

    }

When I run it, the Middle alignment is good but not the Center one :

What is causing this ? How can I fix it ?

Thanks !

Hi,

Notice that the addCompoent() adds the vertical to the content layout of the main window, which is also a VerticalLayout by default. So, you also need to set the content layout as full size with mainWindow.getContent().setSizeFull().

However, probably what you want is to just set the “vertical” as the content with mainWindow.setContent(vertical).

Yeah, it’s working, thank you a lot !