.netmaui

DotNet MAUI Pages


Good day, I am trying to understand the new dotnet MAUI page layout. I want to put a menu bar at the top of the page, And I keep getting the same error: "The property Content is set more than once."

Below is my code of the mainPage.xaml

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         xmlns:local="clr-namespace:testpage"
         xmlns:shared="clr-namespace:testpage.Shared;assembly=testpage.Shared"
         x:Class="testpage.MainPage"
         BackgroundColor="{DynamicResource PageBackgroundColor}">

<StackLayout Padding="20" Spacing="10" VerticalOptions="Center" HorizontalOptions="Center">
    <Label Text="This is Just a test!"
            FontSize="Large"
            HorizontalOptions="Center"
            VerticalOptions="Center" />
</StackLayout>

<BlazorWebView x:Name="blazorWebView" HostPage="wwwroot/index.html">
    <BlazorWebView.RootComponents>
        <RootComponent Selector="#app" ComponentType="{x:Type shared:Routes}" />
    </BlazorWebView.RootComponents>
</BlazorWebView>

Solution

  • a ContentPage can only have a single child element. You have two. To fix this, move your BlazorWebView inside of the StackLayout

    <StackLayout Padding="20" Spacing="10" VerticalOptions="Center" HorizontalOptions="Center">
        <Label Text="This is Just a test!"
                FontSize="Large"
                HorizontalOptions="Center"
                VerticalOptions="Center" />
    
        <BlazorWebView x:Name="blazorWebView" HostPage="wwwroot/index.html">
           <BlazorWebView.RootComponents>
              <RootComponent Selector="#app" ComponentType="{x:Type shared:Routes}" />
           </BlazorWebView.RootComponents>
        </BlazorWebView>
    
    </StackLayout>