Page Comparison

...

Es gibt zwei vordefinierte Themes: Lumo and Material, wobei Lumo das Default-Theme ist. Es ist auch möglich, customCustom-Themes zu definieren. (Mehr zu Custom-Themes im Best Practice Guide)

• Wenn kein Theme explizit definiert ist, wird das Lumo-Theme verwendet.

• Nur ein einziges Theme kann pro Applikation verwendet werden. Es ist also z.B, nicht möglich gleichzeitig für eine Komponente Theme Lumo zu verwenden und für eine Zweite das Theme Material

• Ein Projekt kann mehrere customCustom-Themes beinhalten - aber nur eines verwenden

• Es ist bei laufender Anwendung kein Theme-Wechsel möglich

Beispiele für das Setzen eines Themes:

Lumo in der Variante “Dark”

@Route("")
@Theme(value = Lumo.class, variant = Lumo.DARK)
public class MainLayout extends VerticalLayout {
  ...
}

Custom Theme “my-theme”

@Route("")
@Theme(themeFolder = "my-theme")
public class MainLayout extends VerticalLayout {
  ...
}

InfoDie und Material, als auch Custom-Themes können mit dem GUI-Builder über das Drop-Down-Menü rechts oben gesetzt werden.

...

Image Modified