# Stacked Notification ## Description Stacked Notification is an extension of the default Notification component in V10. It allows you to display different information in a stacked manner. The information can be closed at once or one by one. Optionally a reload button can be provided to allow an automatic reload of several parts of your application. ## Usage examples Please note that all the examples are simple show cases. UI Thread accesses, actions to open the notification, etc. are omitted. ### Simple notification This stacked notification will show three simple text entries. It can be closed at once with the main close button in the notification caption. ``` StackedNotification stackedNotification = new StackedNotification("Contents have changed"); stackedNotification.addItem("Entry 1 has changed"); stackedNotification.addItem("Entry 2 was added"); stackedNotification.addItem("Entry 3 was removed"); stackedNotification.open(); ``` ### Closeable items and reloadable content This notification will allow the user to close single entries one by one as soon as they were acknowledged. Also a reload button will be shown in the caption. This reload button closes the notification and reloads a grid. ``` StackedNotification stackedNotification = new StackedNotification("Contents have changed"); stackedNotification.addCloseableItem("Entry 1 has changed"); stackedNotification.addCloseableItem("Entry 2 was added"); stackedNotification.addCloseableItem("Entry 3 was removed"); stackedNotification.addReloadClickListeners(event -> grid.getDataProvider().refreshAll()); stackedNotification.open(); ``` ### Usage of components as content ``` private void createNotification() { // Caption can be a component as well Span caption = new Span("Contents have changed"); caption.getStyle().set("font-weight", "bold"); StackedNotification stackedNotification = new StackedNotification(caption); stackedNotification.addCloseableItem(wrapImageEntry("Entry 1 has changed", "http://...")); stackedNotification.addCloseableItem(wrapImageEntry("Entry 2 has changed", "http://...")); stackedNotification.addCloseableItem(new Span("Entry 3 was removed")); stackedNotification.addReloadClickListeners(event -> grid.getDataProvider().refreshAll()); stackedNotification.open(); } private Component wrapImageEntry(String content, String imageSource) { Div div = new Div(); div.add(new Image(imageSource, "some image")); div.add(new Span(content)); // ... we should do some styling here return div; } ```