The DevExpress Blazor Toast component allows you to initiate communications (about processes and events) with end users via “toast” notifications.
The DxToastProvider component serves as a toast container and should be declared where toasts will be displayed. In this demo, toasts are created at runtime. The IToastNotificationService interface implements methods for dynamic toast creation. Inject the service in your page and call the ShowToast method to create a toast at runtime.
The DxToastProvider component allows you to define common toast settings. The following properties specify toast size and position:
The Toast component supports four theme modes (Dark, Light, Pastel, and Saturated) and the following notification styles:
DangerInfoPrimarySuccessWarning
You can combine these settings to customize toast appearance as needed.
In this demo, the ShowToast method displays toasts at runtime. The method accepts a ToastOptions object as a parameter. This object's ToastOptions.RenderStyle and ToastOptions.ThemeMode properties define toast appearance.
You can use RenderStyle and ThemeMode properties at the DxToastProvider level to specify common style settings for toasts used across your DevExpress-powered Blazor app.
Toast notifications appear with a predefined animation effect specified by the AnimationType property. You can select one of the following animation types: Slide, Fade, or SlideAndFade.
A toast notification can include templates (render fragments). This content is displayed below toast title and text if visible, or occupies the entire toast body if it does not include text.
This demo contains three DxToast components defined in markup. Each toast includes child content that is rendered as a template. Click a button to call the Show method and display a toast.