Vaadin 7 UI Design By Example: Beginner's Guide

Time for action – using absolute layouts

Let's use an absolute layout.

1. This is pretty straightforward. Change your LayoutFrameworkUI class to add the highlighted code:

   public class LayoutFrameworkUI extends UI {
   
     protected void init(VaadinRequest request) {
   
       ...
   
       layout.addMenuOption("Absolut layout",
           getAbsolutLayout());
     }
   
     ...
   
     private Component getAbsolutLayout() {
       Button button = new Button(
           "I'm whimsically located at 42, 57");
   
       AbsoluteLayout absoluteLayout = new AbsoluteLayout();
       absoluteLayout.addComponent(button,
         "left: 42px; top: 57px");
   
       return absoluteLayout;
     }
   }

2. Run and gun, oh, sorry, that's basketball. Run and test, that is software development, oh yeah.

What just happened?

As expected the button is located exactly at the pixel coordinates ...