.NET Maui Blazor Hybrid: open second window with parameters

Question

Within my maui blazor hybrid project I can open a new window of this application. Is it possible to pass parameters?

Something like:

private void OnOpenWindowClicked()
{
    var secondWindow = new Window
        {
            Page = new HomePage
            {
                test = "test";
            }
        };

    Application.Current.OpenWindow(secondWindow);
}

And on this page something like:

@code {
    [Parameter]
    public string test { get; set; } = "";
}

Is this possible somehow?

Answer 1

Notice that Razor pages are compiled into C# classes that by default inherit from Componentbase. So if you want to use Application.Current.OpenWindow, you need to keep HomePage inherit from Microsoft.Maui.Controls.Page, e.g. NavigationPage/ContentPage.

Use the following code:

Create a default MAUI Blazor Hybrid App project and then add a button and the code in Counter.razor:

@page "/counter"


<h1>Counter</h1>


<p role="status">Current count: @currentCount</p>


<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
<br />
<br />


<button class="btn btn-primary" @onclick="OnOpenWindowClicked">Open second window</button>


@code {
    private int currentCount = 0;


   private void IncrementCount()
    {
        currentCount++;
    }


   private void OnOpenWindowClicked()
    {
        var secondWindow = new Window()
            {
                Page = new NewPage1("Meow~")
            };


       Application.Current.OpenWindow(secondWindow);
    }
}

Add a ContentPage to project root directory:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="MauiApp4.NewPage1"
             Title="NewPage1">
    <VerticalStackLayout Margin="100">
        <Label x:Name="text"
            Text="Welcome to .NET MAUI!"
            TextColor="DarkBlue"
            VerticalOptions="Center"
            HorizontalOptions="Center" />
        <Image Source="dsc.JPG"
               WidthRequest="800"
               HeightRequest="600"
               Aspect="AspectFit"/>
    </VerticalStackLayout>
</ContentPage>

public partial class NewPage1 : ContentPage
{
    public string Text { get; set; } = "";
    public NewPage1(string t)
    {
        Text = t;
        InitializeComponent();
        text.Text = Text;
    }
}

Here is the effect.