Showing a login form in pop-up view

We can easily add any component into the pop-up view. Let's create an application that has one pop-up view with the text Click me!. When the user clicks on the Click me! text, the login form is shown.

The pop-up view might be also used for showing a long description of a field within a form or any other component.

The following screenshot shows the Click me! text:

When we click on it, the following login window appears in the browser:

How to do it...

Carry out the following steps:

1. Create a new vertical layout in the init method and set it as the content of UI.

   final VerticalLayout layout = new VerticalLayout();
   layout.setMargin(true);
   setContent(layout);

2. Then create the login form.

   VerticalLayout login = new VerticalLayout();
   TextField txtUsername = new TextField("Username:");
   login.addComponent(txtUsername);
   TextField txtPassword = new TextField("Password:");
   login.addComponent(txtPassword);
   Button btnLogin = new Button("Login");
   login.addComponent(btnLogin)...