ReactiveUI MAUI中ReactiveTabbedPage在UWP平台选中标签名重复显示的移除方案问询

你遇到的这个问题是UWP平台的特性导致的——MAUI的TabbedPage（包括ReactiveUI的ReactiveTabbedPage）默认会把当前选中页面的Title同步显示在UWP窗口的右上角标题栏里，和标签栏的标题重复了。下面给你几个简单的解决方法，按需选择：

方法一：针对ReactiveTabbedPage局部处理（推荐） #

这种方法只影响你的ReactiveTabbedPage页面，不会改动全局设置：

1. 打开你的MainPage.xaml.cs，在构造函数里添加UWP平台专属的代码，监听标签切换事件并清空窗口标题：

public partial class MainPage : ReactiveTabbedPage<MainViewModel>
{
    public MainPage(MainViewModel viewModel)
    {
        InitializeComponent();
        ViewModel = viewModel;

#if WINDOWS
        // 初始加载时清空窗口标题
        if (Application.Current.Windows[0].Handler.PlatformView is Windows.UI.Xaml.Window window)
        {
            window.Title = string.Empty;
        }

        // 切换标签页时同步清空标题
        CurrentPageChanged += (sender, e) =>
        {
            if (Application.Current.Windows[0].Handler.PlatformView is Windows.UI.Xaml.Window win)
            {
                win.Title = string.Empty;
            }
        };
#endif
    }
}

这样每次切换标签，右上角的重复标题都会被清空，标签栏的标题不受影响。

方法二：全局隐藏UWP窗口标题 #

如果你希望整个应用的UWP窗口都不显示标题，可以修改UWP平台的启动代码：

1. 打开项目中Platforms/UWP/App.xaml.cs文件，找到OnLaunched方法，添加以下代码：

protected override void OnLaunched(LaunchActivatedEventArgs e)
{
    base.OnLaunched(e);

    var window = Application.Current.Windows[0].Handler.PlatformView as Windows.UI.Xaml.Window;
    if (window != null)
    {
        // 直接清空窗口标题，或者设置TitleBar为空来隐藏整个标题区域
        window.Title = string.Empty;
        // 如果需要完全隐藏标题栏，可以用下面这行（注意会移除标题栏的拖拽等功能）
        // window.SetTitleBar(null);
    }
}

方法三：自定义Handler（更灵活的进阶方式） #

如果需要更定制化的控制，可以给ReactiveTabbedPage写一个UWP专属的Handler：

1. 在Platforms/UWP目录下创建CustomReactiveTabbedPageHandler.cs文件：

using Microsoft.Maui.Handlers;
using ReactiveUI.Maui;
using Windows.UI.Xaml;

namespace YourAppNamespace.Platforms.UWP;

public class CustomReactiveTabbedPageHandler : TabbedPageHandler
{
    protected override void ConnectHandler(Frame platformView)
    {
        base.ConnectHandler(platformView);
        
        if (MauiContext?.Window?.Handler?.PlatformView is Window window && VirtualView is ReactiveTabbedPage tabbedPage)
        {
            // 初始清空标题
            window.Title = string.Empty;
            
            // 监听标签切换事件，保持标题为空
            tabbedPage.CurrentPageChanged += (s, e) => window.Title = string.Empty;
        }
    }
}

2. 在MauiProgram.cs中注册这个Handler：

using YourAppNamespace.Platforms.UWP;
using ReactiveUI.Maui;

public static class MauiProgram
{
    public static MauiApp CreateMauiApp()
    {
        var builder = MauiApp.CreateBuilder();
        builder
            .UseMauiApp<App>()
            .ConfigureFonts(fonts =>
            {
                fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
                fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
            })
            .UseReactiveUI();

#if WINDOWS
        builder.ConfigureMauiHandlers(handlers =>
        {
            handlers.AddHandler<ReactiveTabbedPage, CustomReactiveTabbedPageHandler>();
        });
#endif

        // 注册你的视图模型
        builder.Services.AddSingleton<MainViewModel>();
        builder.Services.AddSingleton<FirstViewModel>();

        return builder.Build();
    }
}

以上三种方法都能解决你遇到的重复标题问题，方法一最轻便，适合只处理单个TabbedPage的场景；方法二适合全局隐藏标题；方法三适合需要更多定制化的情况。

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