The simple way to add dependencies such as CSS, JavaScript or HTML to the current page for screens and fragments is to use the ScreenDependencyUtils helper class. You can obtain dependencies from the following sources:

  • WebJar resource - starts with webjar://

  • File placed within VAADIN directory - starts with vaadin://

  • Web resource - starts with http:// or https://

This helper class has the following methods for adding and getting dependencies:

  • setScreenDependencies - sets a list of dependencies.

  • addScreenDependencies - adds dependencies paths.

  • addScreenDependency - adds a dependency path.

  • List<ClientDependency> getScreenDependencies - returns a list of previously added dependencies.

In the example a CSS file is added to the login screen:

protected void loadStyles() {
                  "vaadin://brand-login-screen/login.css", Dependency.Type.STYLESHEET);

As the result the following import will be added to the page header:

<link rel="stylesheet" type="text/css" href="http://localhost:8080/app/VAADIN/brand-login-screen/login.css">

Added CSS file is being applied only to the login screen:

branding login screen