Important Notice - Forums is archived

To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.

Product icon

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.

Help please with layout alignment...

Nick Sideras
10 years ago Mar 01, 2012 2:23pm
Mathias Clerc
10 years ago Mar 02, 2012 1:07am
Nick Sideras
10 years ago Mar 02, 2012 8:51am
Mathias Clerc
10 years ago Mar 05, 2012 4:27am

I mostly copy/pasted it in an empty project and it resizes correctly.
Check between the following sample and your code what you may be missing (setting width of the window ?)

Try running with the parameter ?debug added to the URL, it will show a debug window. Then click on AL (or "Analyse Layouts" depending on versions) and it will output layout errors.

public class TestApplication extends Application {
    public void init() {
        Window mainWindow = new Window("Test Application");

        //Define the theme
        //Make window use all horizontal space
        mainWindow.setWidth(100, Component.UNITS_PERCENTAGE);
        //Add the layouts

    public void addTop(Window window) {
        HorizontalLayout top = new HorizontalLayout();
        top.setWidth(100, Component.UNITS_PERCENTAGE);
        top.setMargin(false, true, false, true); // Enable horizontal margins


        VerticalLayout vlayout1 = new VerticalLayout();
        vlayout1.setWidth(100, Component.UNITS_PERCENTAGE);
        vlayout1.setHeight(40, Component.UNITS_PIXELS);
        vlayout1.setStyleName(Reindeer.LAYOUT_BLACK); //give some color to see what happens

        VerticalLayout vlayout2 = new VerticalLayout();
        vlayout2.setWidth(100, Component.UNITS_PERCENTAGE);
        vlayout2.setHeight(40, Component.UNITS_PIXELS);
        vlayout2.setStyleName(Reindeer.LAYOUT_BLUE); //give some color to see what happens

        top.setExpandRatio(vlayout1, 8.0F);
        top.setExpandRatio(vlayout2, 2.0F);

Nick Sideras
10 years ago Mar 06, 2012 12:09pm