We’d like to introduce an experimental feature – Toast. It is a simple feedback about an operation. Though ZK has a similar Notification since ZK 6.0.1, there are some differences between them.

In contrast with Notification, Toast can:

  • Be positioned relative to the viewport even if the page is scrolled.
  • Be stackable. Indicating that the later toasts will not overlay the previous ones.

But Toast can’t:

  • Use a mouse cursor (at_pointer or after_pointer) or a component as a position reference.
  • Use a custom position (x, y).

You can use Toast if you just want to show a message in application. However, it is recommended to keep using Notification if you want the message to stick to a specific component.


The demo below demonstrates the basic usage of a Toast.

Required Configuration


  • ZK 8.0.0 or later


// a simple toast"Hello World");

// an error toast positioned at bottom-right of browser window
  "Operation aborted!", "error", "bottom_right", 5000, false

Java API

We provide several methods to invoke a Toast:

  1. void show(String msg):
    a five-second toast notification message at the top-center of the browser window.
  2. void show(String msg, String type, String position):
    a five-second toast notification message.
  3. void show(String msg, String type, String position, int duration, boolean closable):
    a toast notification message.


  • HTML can be used in a message, so escape the string if necessary.
  • The type can be “info” (default), “warning” or “error”.
  • The default duration is 5000ms.
  • The closable attribute can toggle if the close button should be visible. (default false)
  • Only nine positions can be used. Please check the table below for more details.
left center right
top top_left top_center (default) top_right
middle middle_left middle_center middle_right
bottom bottom_left bottom_center bottom_right

This component is currently in beta. If you are interested in using this component please contact us at


The whole demo project can be found on the GitHub project.

If you enjoyed this post, please consider leaving a comment or subscribing to the RSS feed to have future articles delivered to your feed reader.

Leave a Reply