.NET MAUI页面跳转后Flyout菜单图标缺失问题求助

问题原因 #

从LoginScreen通过按钮点击跳转至UserHomeScreen时，Shell默认使用相对路由，将UserHomeScreen作为LoginScreen的子页面加载，因此导航栏显示返回按钮而非Flyout菜单图标。而通过Flyout菜单打开时，UserHomeScreen是作为Shell的顶级页面加载，所以Flyout图标正常显示。

解决方案 #

方案1：使用绝对路由跳转

修改LoginScreen.xaml.cs中的点击事件代码，用三个斜杠(///)指定绝对路由，强制从Shell根节点导航，让UserHomeScreen作为顶级页面加载：

private async void btnLoginOK_Clicked(object sender, EventArgs e)
{
    await Shell.Current.GoToAsync($"///{nameof(UserHomeScreen)}");
}

方案2：调整Shell路由结构并设置当前项

1. 修改App.Shell.xaml，给两个FlyoutItem设置唯一Route（避免路由冲突）：

<FlyoutItem FlyoutDisplayOptions="AsMultipleItems" Route="LoginRoute">
    <ShellContent
        Title="Login"
        ContentTemplate="{DataTemplate local:Views.LoginScreen}"/>
</FlyoutItem>
<FlyoutItem FlyoutDisplayOptions="AsMultipleItems" Route="HomeRoute">
    <ShellContent
        Title="Home Screen"
        ContentTemplate="{DataTemplate local:Views.UserHomeScreen}"/>
</FlyoutItem>

2. 在LoginScreen的点击事件中，直接将对应FlyoutItem设置为Shell当前项：

private async void btnLoginOK_Clicked(object sender, EventArgs e)
{
    var homeFlyoutItem = Shell.Current.Items.FirstOrDefault(item => item.Route == "HomeRoute");
    if (homeFlyoutItem != null)
    {
        Shell.Current.CurrentItem = homeFlyoutItem;
    }
}

额外优化 #

由于你已在App.Shell.xaml中通过ShellContent定义了页面，后台的路由注册代码属于冗余内容，可以删除AppShell.cs中的以下代码：

Routing.RegisterRoute(nameof(LoginScreen), typeof(LoginScreen));
Routing.RegisterRoute(nameof(UserHomeScreen ), typeof(UserHomeScreen ));

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