ExpandingComponentExample.java
package com.itmill.toolkit.demo.sampler.features.layouts;

import com.itmill.toolkit.ui.Button;
import com.itmill.toolkit.ui.HorizontalLayout;
import com.itmill.toolkit.ui.VerticalLayout;

public class ExpandingComponentExample extends VerticalLayout {

    public ExpandingComponentExample() {
        setSpacing(true);

        // Basic scenario: single expanded component
            HorizontalLayout layout = new HorizontalLayout();
            layout.setWidth("100%")// make the layout grow with the window
            // size
            addComponent(layout);

            Button naturalButton = new Button("Natural");
            naturalButton
                    .setDescription("This button does not have an explicit size - instead, it's size depends on it's content - a.k.a <i>natural size.</i>");
            layout.addComponent(naturalButton);

            Button expandedButton = new Button("Expanded");
            expandedButton.setWidth("100%");
            expandedButton
                    .setDescription("This button is set to 100% and expanded, and will thus occupy the space left over by the other components.");
            layout.addComponent(expandedButton);
            layout.setExpandRatio(expandedButton, 1.0f);

            Button sizedButton = new Button("Explicit");
            sizedButton.setWidth("150px");
            sizedButton
                    .setDescription("This button is explicitly set to be 150 pixels wide.");
            layout.addComponent(sizedButton);
        }

        // Ratio example
            HorizontalLayout layout = new HorizontalLayout();
            layout.setWidth("100%")// make the layout grow with the window
            // size
            addComponent(layout);

            Button naturalButton = new Button("Natural");
            naturalButton
                    .setDescription("This button does not have an explicit size - instead, it's size depends on it's content - a.k.a <i>natural size.</i>");
            layout.addComponent(naturalButton);

            Button expandedButton1 = new Button("Ratio 1.0");
            expandedButton1.setWidth("100%");
            expandedButton1
                    .setDescription("This button is set to 100% and expanded with a ratio of 1.0, and will in this example occupy 1:2 of the leftover space.");
            layout.addComponent(expandedButton1);
            layout.setExpandRatio(expandedButton1, 1.0f);

            Button expandedButton2 = new Button("Ratio 2.0");
            expandedButton2.setWidth("100%");
            expandedButton2
                    .setDescription("This button is set to 100% and expanded with a ratio of 2.0, and will in this example occupy 2:1 of the leftover space.");
            layout.addComponent(expandedButton2);
            layout.setExpandRatio(expandedButton2, 2.0f);
        }

    }
}