Vaadin Framework - Introducción - Ejemplo de la Aplicación de Tutorial

Ejemplo de la Aplicación de Tutorial

Sigamos la larga tradición de decir primero "¡Hola Mundo!" Cuando se aprende un nuevo framework de programación. Primero, utilizando la API principal del servidor.

import com.vaadin.server.VaadinRequest;
import com.vaadin.ui.Label;
import com.vaadin.ui.UI;

@Title("My UI")
public class HelloWorld extends UI {
    @Override
    protected void init(VaadinRequest request) {
        // Crear el contenido raiz del diseño para la intefaz de usuario
        VerticalLayout content = new VerticalLayout();
        setContent(content);

        // Mostrar el saludo
        content.addComponent(new Label("Hola Mundo!"));

        // Tener un botón pulsable
        content.addComponent(new Button("Pulsame!",
            click -> Notification.show("Pulsado!")));
    }
}

Una aplicación Vaadin tiene una o más interfaces de usuario que extienden de la clase com.vaadin.ui.UI. Una interfaz de usuario es una parte de la página web en la que se ejecuta la aplicación Vaadin. Una aplicación puede tener varias interfaces de usuario en la misma página, especialmente en portales o en diferentes ventanas o pestañas. Una interfaz de usuario se asocia a una sesión de usuario, y una sesión se crea para cada usuario que utiliza la aplicación. En el contexto de nuestra interfaz de usuario Hola Mundo, basta con saber que se crea una sesión subyacente cuando el usuario accede primero a la aplicación abriendo la página, y se invoca en ese momento el método init().

El título de la página, que se muestra en el título de la ventana o pestaña del navegador, se define con una anotación. El ejemplo utiliza un componente de diseño como el contenido raíz de la interfaz de usuario, como es el caso con la mayoría de las aplicaciones de Vaadin, que normalmente tienen más de un componente. A continuación, crea un nuevo componente de interfaz de usuario Label, que muestra un texto simple y establece el texto en "Hola Mundo!". La etiqueta se agrega al diseño.

El ejemplo también muestra cómo crear un botón y manejar eventos clic del botón. El manejo de eventos se describe en "Eventos y Oyentes" y la parte práctica en "Manejo de Eventos con Oyentes". En Java 8, puede implementar oyentes con expresiones lambda, lo que simplifica significativamente el código del manejador.

El resultado de la aplicación Hola Mundo, cuando se abre en un navegador, se muestra en la Aplicación Hola Mundo.

Figura 1. Aplicación  Hola Mundo

Para ejecutar un programa, debe empaquetarlo como un paquete WAR de aplicación web y desplegarlo en un servidor, tal como se explica en "Despliegue de una Aplicación". Durante el desarrollo, normalmente se despliega en un servidor de aplicaciones integrado con el IDE.