3.5.7. Notifications

Notifications are pop-ups displayed in the center or in the corner of the main application window. They can disappear automatically or when the user clicks on the screen or presses Esc.

In order to show a notification, inject the Notifications bean into the screen controller and use its fluent interface. In the following example, a notification is shown on the button click:

@Inject
private Notifications notifications;

@Subscribe("sayHelloBtn")
protected void onSayHelloBtnClick(Button.ClickEvent event) {
    notifications.create().withCaption("Hello!").show();
}

A notification can have a description which is displayed under the caption in a lighter font:

@Inject
private Notifications notifications;

@Subscribe("sayHelloBtn")
protected void onSayHelloBtnClick(Button.ClickEvent event) {
    notifications.create().withCaption("Greeting").withDescription("Hello World!").show();
}

Notifications can be of the following types:

  • TRAY - a notification is displayed in the bottom right corner of the application and disappears automatically.

  • HUMANIZED – a standard notification displayed in the center of the screen, disappears automatically.

  • WARNING – a warning. Disappears when user clicks on the screen.

  • ERROR– a notification about an error. Disappears when user clicks on the screen.

The default type is HUMANIZED. You can provide another type in the create() method:

@Inject
private Notifications notifications;

@Subscribe("sayHelloBtn")
protected void onSayHelloBtnClick(Button.ClickEvent event) {
    notifications.create(Notifications.NotificationType.TRAY).withCaption("Hello World!").show();
}

You can use \n characters for line breaks in messages. In order to show HTML, use the withContentMode() method:

@Inject
private Notifications notifications;

@Subscribe("sayHelloBtn")
protected void onSayHelloBtnClick(Button.ClickEvent event) {
    notifications.create()
            .withContentMode(ContentMode.HTML)
            .withCaption("<i>Hello World!</i>")
            .show();
}

When using HTML, don’t forget to escape data to prevent code injection.

The other methods such as withHideDelayMs(), withPosition() and withStyleName() allow you to customize the notification look and behavior.