Dialog

Dialoge sind kleine Pop-Ups die z.B. durch einen Buttonklick aufgerufen werden können. Diese können alle Arten von UI-Komponente beinhalten und können durch einen Klick außerhalb wieder verschwinden.

Erstellen von einen simplen Dialog:

Ein simpler Dialog kann einfach per Code schnell erstellt werden.

final VerticalLayout layout = new VerticalLayout();
final Dialog         dialog = new Dialog(layout);
final Label          label  = new Label("Message sent");
final Button         ok     = new Button("OK", e -> dialog.close());

layout.add(label, ok);
dialog.open();

Erstellen von einen komplexen Dialog:

Für einen komplexeren Dialog werden wir eine extra View erstellen, was uns erleichtert den Dialog zu designen.

Zuerst muss ein neuen GUI-Element erstellt werden
Diese View kann dann nach beliebend designed werden
Dann diese einfach dem Dialog übergeben. Um die OK-Close Funktionalität aus dem ersten Beispiel beizubehalten wird die Close-Methode als Runnable übergeben.
final Dialog dialog = new Dialog(); dialog.add(new MyDialogView(dialog::close)); dialog.open();

Tipp: Die Größe eines Dialogs kann direkt mit Dialog.setWidth() & Dialog.setHeight() bestimmt werden. Es muss aber auch darauf geachtet werden was das Layout darin eingestellt hat.