Erstellen Sie zuerst ein Themenverzeichnis: / WebContent / VAADIN / themes / mynewtheme

Dann legen Sie Ihre benutzerdefinierte favicon.ico in diesem Verzeichnis. Sie müssen die Design-Eigenschaft auch in Ihrer Anwendung festlegen:

Hier ist eine detailliertere Version der ähnlichen Antwort von Greg Ballot. Meine Antwort bezieht sich hier auf Vaadin 7, aktuell ab 7.5.3.

Benutzerdefiniertes Thema

In Vaadin 7,5 können Sie Ihre Favicon-Grafikdatei in Ihr eigenes benutzerdefiniertes Thema . Wenn Sie das Vaadin-Plugin für verschiedene IDEs verwenden ( NetBeans , Eclipse ) oder Maven Archetypen , sollte ein benutzerdefiniertes Theme namens mytheme bereits für Sie erstellt worden sein. Legen Sie Ihre Bilddatei in den Ordner mytheme .

Der Hauptteil Ihrer Vaadin 7 App, Ihre Unterklasse von UI , muss angeben, dass Ihr benutzerdefiniertes Design verwendet wird. Wenn Sie die IDE-Plugins und / oder den Maven-Archetyp verwenden, sollte dies bereits für Sie konfiguriert worden sein. Der einfachste Weg ist eine Java Annotation in der UI-Unterklasse.

Favicon Verwendung / Verhalten nicht Standard

Denken Sie daran, dass das Favicon-Verhalten nicht standardisiert ist. Favicons entwickelten sich willkürlich, meist aus Spaß. Das genaue Verhalten hängt vom jeweiligen Browser und bestimmten Server ab. Anders als der spezielle Ordner, ist dies für Vaadin nichts Besonderes.

Bilddateiformate

Ursprünglich wurde ausschließlich das ICO-Dateiformat verwendet. Seitdem haben sich die meisten Browser so entwickelt, dass sie jedes der folgenden Formate akzeptieren können: JPEG , TIFF und PNG .

Bildgröße / Auflösung

Ursprünglich sollten Favicons sehr kleine Bitmap-Icons sein. Einige Browser haben das Favicon in Situationen verwendet, in denen Sie ein Bild mit höherer Auflösung bereitstellen möchten. Beachten Sie jedoch, dass kleinere Dateien schneller geladen werden, ohne dass die Benutzer warten müssen.

Favicon Dateiname

Einige Browser oder Server können andere Dateinamen oder Namenserweiterungen verarbeiten, aber ich fand es am einfachsten, meine Datei genau zu benennen favicon.ico - auch wenn Sie ein anderes Format verwenden! Normalerweise verwende ich eine PNG-Datei, benenne sie aber mit der .ico-Erweiterung. Ich kann zwar nicht garantieren, dass diese Praxis bei jedem Server und Browser funktioniert, aber ich habe kein Problem festgestellt.

Vorhandene Favicon-Datei

Neueste Versionen von Vaadin haben ein Vaadin-bezogenes Symbol in einer favicon.ico-Datei in einem konfigurierten Projekt enthalten. Sie müssen diese Datei also durch Ihre eigene ersetzen. In Vaadin 7.5.3 enthält die Datei vier Größen, die größte sieht folgendermaßen aus:

Ältere Versionen haben keine Datei hinzugefügt. Sie können also Ihre eigenen hinzufügen.

IDE Screen Shots

Hier sind ein paar Screenshots. Die eine ist die Projektansicht (logisch) in NetBeans 8, während die andere eine Ansicht für Dateien (physisch) ist.

Im Falle eines benutzerdefinierten Symbolnamens (Vaadin 7):

BEARBEITEN

Es ist besser, das BootstrapListener als statische verschachtelte Klasse zu verwenden: link