Maui Blazor Set Startup Page on Open

Question

Seems a simple enough task, but I'm stymied:

I want to direct the startup page of the app based on a LocalStorage setting.

I'm able to get (and set) LocalStorage without problem, but can't seem to find how to redirect.

app.xaml.cs does the usual:

public App()
{
    InitializeComponent();

    MainPage = new MainPage();
}

and MainPage.xaml.cs:

public MainPage()
{
    InitializeComponent();

    // set redirection page here
    var navPage = GetLocalStorageValue(key: "startupPage", default: "/");
}

Thanks in advance!

Welcome to Stack Overflow. Please take the [tour] to learn how Stack Overflow works and read [ask] on how to improve the quality of your question. Then [edit] your question to include your source code as a working [mcve], which can be compiled and tested by others. It is unclear what you are asking or what the problem is. — Progman, Jun 03 '23 at 18:42
Why don't you get local storage value in `public App()` and decide which page should be the main one accordingly? As @Progman said, it's not exactly clear what you're trying to do... — Marco, Jun 03 '23 at 19:52
Thanks so much for the responses and apologies for my lack of clarity. Unfortunately, I couldn't post a working example, since it's the specific code (process) I'm looking for! :) Specifically: When my Maui Blazor app opens, I want to show a different home page based on a setting retrieved from LocalStorage. Say it returns a "0" I would should a standard intro page. If it returns a "1", I'd show a members page, a "2" would return a sign-up page, etc. — dwneder, Jun 05 '23 at 03:02

score 0 · Answer 1 · answered Jun 19 '23 at 09:24

You can use the Command to make the redirect. You can use the Command to pass the CommandParameter to the code behind then you can navigate to the page you want.

Code in the MainPage.xaml.cs:

public partial class MainPage : ContentPage
{
    public ICommand NavigateCommand { get; private set; }

    public MainPage()
    {
        InitializeComponent();

        NavigateCommand = new Command<Type>(
            async (Type pageType) =>
            {
                Page page = (Page)Activator.CreateInstance(pageType);
                await Navigation.PushAsync(page);
            });

        BindingContext = this;
    }
}

Code in the MainPage.xaml:

<TextCell Text="Customimze an Entry"
          Detail="Select text on focus"
          Command="{Binding NavigateCommand}"
          CommandParameter="{x:Type views:CustomizeEntryPage}" />

score 0 · Answer 2 · answered Jun 19 '23 at 10:33

Create a StorageSettingsRedirect.razor component whithout any html content. Add it to your MainLayout.

@inject NavigationManager nav
@inject MyStorageService storageService

@code {
     protected override Task OnInitializedAsync()
    {
        if (await storageService.NeedGoTosetting())
            nav.NavigateTo("/storageSettingsRoute");
        return base.OnInitializedAsync();
    }

When the MainLayout will be displayed, it will render this component. So it will initialize only once at your program startup (unless you changes your mainLayout, in that case I would recommend using one MainLayout and nestedLayouts). Then when your StorageSettingsRedirect component will be initilized, it will check if it needs to redirect to the setting page, and use the navigationManager to change the route

Maui Blazor Set Startup Page on Open

2 Answers2