.NET MAUI：如何自定义Shell ContentPage头部栏

当然可以实现，由于你的页面是通过Shell承载的，直接利用Shell的TitleView或自定义导航栏模板就能完成需求，以下是两种常用方案：

方案一：单页面自定义TitleView #

直接在目标ContentPage中添加TitleView替换默认标题区域，可自由组合任意控件，仅对当前页面生效：

修改后的Arrival页面XAML代码：

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"        
             x:Class="FluxMobile.Pages.Arrival">
    <!-- 自定义标题栏内容 -->
    <ContentPage.TitleView>
        <HorizontalStackLayout Spacing="10" VerticalOptions="Center" Padding="0,0,10,0">
            <!-- 标题文本 -->
            <Label Text="Arrival" FontSize="Large" FontAttributes="Bold" />
            <!-- 根据需求添加控件，示例为搜索框和加号按钮 -->
            <Entry Placeholder="搜索" WidthRequest="150" BackgroundColor="White" CornerRadius="8" />
            <Button Text="+" BackgroundColor="#2ECC71" TextColor="White" 
                    WidthRequest="32" HeightRequest="32" CornerRadius="16" />
        </HorizontalStackLayout>
    </ContentPage.TitleView>

    <VerticalStackLayout>
        <Label 
            Text="Welcome to .NET MAUI!"
            VerticalOptions="Center" 
            HorizontalOptions="Center" />
    </VerticalStackLayout>
</ContentPage>

你可以根据需求调整布局、控件类型和样式，完全匹配示例图的效果。

方案二：全局自定义Shell导航栏模板 #

如果需要多个页面保持统一的标题栏样式，可在AppShell.xaml中定义全局模板，所有Shell承载的页面都会自动应用：

<Shell xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
       xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
       xmlns:pages="clr-namespace:FluxMobile.Pages"
       xmlns:res="clr-namespace:FluxMobile.Resources"
       x:Class="FluxMobile.AppShell">
    <!-- 全局导航栏模板 -->
    <Shell.NavBarTemplate>
        <Grid ColumnDefinitions="Auto,*,Auto" HeightRequest="48" BackgroundColor="{StaticResource Primary}">
            <!-- 返回按钮（自动适配页面层级） -->
            <Button Grid.Column="0" Text="←" TextColor="White" BackgroundColor="Transparent"
                    Command="{Binding GoBackCommand, Source={RelativeSource AncestorType={x:Type Shell}}}" />
            <!-- 绑定Shell的Title属性，自动显示页面标题 -->
            <Label Grid.Column="1" Text="{Binding Title}" FontSize="Large" FontAttributes="Bold"
                   TextColor="White" VerticalOptions="Center" HorizontalOptions="Start" Margin="10,0,0,0" />
            <!-- 右侧自定义控件组 -->
            <HorizontalStackLayout Grid.Column="2" Spacing="8" VerticalOptions="Center" Margin="0,0,10,0">
                <Entry Placeholder="搜索" WidthRequest="120" BackgroundColor="White" CornerRadius="8" />
                <Button Text="+" BackgroundColor="#2ECC71" TextColor="White" 
                        WidthRequest="32" HeightRequest="32" CornerRadius="16" />
            </HorizontalStackLayout>
        </Grid>
    </Shell.NavBarTemplate>

    <ShellContent Title="{x:Static res:AppRes.Arrival}" Icon="arrival.png" ContentTemplate="{DataTemplate pages:Arrival}" Route="Arrival" />
</Shell>

若某页面需要特殊样式，只需在该页面的TitleView中单独定义即可覆盖全局模板。

内容的提问来源于stack exchange，提问作者nicetomitja