Blazorise NotificationService - Change default Position

Question

I have followed all the steps to add Blazorise Notification service in the project. By default the message is shown on the bottom of the page. I want to show it on the Center TOP of the page.

Answer 1

When you Add the provider you could set the location like below:

<NotificationProvider Location="Blazorise.NotificationLocation.Start" />

But the problem is if you check out the NotificationLocation enum, there is only "start" (bottom left) , "end" (bottom right), "center" (bottom middle).

As the document said "Notification" is built on top of "Snackbar". If we check the code of NotificationProvider you will find a method called GetSnackbarStackLocation which map the "NotificationLocation" to "SnackbarStackLocation". Luckily the SnackbarStackLocation enum has "Top" option (top middle).

So if you don't mind you create a custom provider and override the GetSnackbarStackLocation method to map default behaviour to SnackbarStackLocation.Top

Such as following:

    public class MyNotificationProvider : NotificationProvider
    {
        protected override SnackbarStackLocation GetSnackbarStackLocation(NotificationLocation notificationLocation)
        {
            return notificationLocation switch
            {
                NotificationLocation.Start => SnackbarStackLocation.Start,
                NotificationLocation.End => SnackbarStackLocation.End,
                _ => SnackbarStackLocation.Top,
            };
        }
    }

Then you could add the provider like

<MyNotificationProvider />

But the display result will be top middle