为各种页面添加 Shell 导航模板 Xamarin.Forms Shell

Question

我有一个多页应用程序，其中有 preLogin 部分和 postLogin 部分。 为这两个部分制作 shell 模板的最佳方法是什么？ preLogin 页面在导航栏中没有后退按钮。我在 xaml 页面 NavigationPage.HasNavigationBar="false"（不是 AppShell.xaml，在我的页面 xaml 中）以及 NavigationPage.SetHasNavigationBar(this, false); 后面的代码中尝试过

示例 xaml 页面，不管我的 NavigationPage.HasBackButton="false"

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
             xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:d="http://xamarin.com/schemas/2014/forms/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:customViewEntry="clr-namespace:App.CustomViews.Entries"
             xmlns:header="clr-namespace:App.CustomViews.CustomHeaders"
             mc:Ignorable="d"
             x:Class="App.Views.Login.EnterEmailAndPasswordPage" 
             NavigationPage.HasBackButton="false"
             BackgroundImageSource="Login_Screen_Green.png">
    <ContentPage.Content>
        <StackLayout>
            <header:HeaderWithTopRightIcon ImageUri="greenIcon.png"/>
            <StackLayout VerticalOptions="EndAndExpand" Padding="0,50">
                <customViewEntry:EvEntry 
                Placeholder="Enter your email"/>
                <customViewEntry:EvEntry 
                Placeholder="Enter your password"
                IsPassword="True"/>
                <Button 
                Text="LOGIN"
                Margin="25,0"
                CornerRadius="7"
                BackgroundColor="{StaticResource DarkGrayColor}"
                TextColor="White"
                Command="{Binding OpenEmailVerificationPageCommand}"/>
                <Label 
                Padding="0,25,0,0"
                Text="Don't have an account?"
                FontSize="Small"
                Style="{StaticResource WhiteSmallLabelStyle}"
                HorizontalOptions="Center"
                VerticalOptions="Start"/>
                <Label 
                Text="SIGN UP"
                TextDecorations="Underline" 
                FontSize="Small"
                Style="{StaticResource WhiteSmallBoldLabelStyle}">
                    <Label.GestureRecognizers>
                        <TapGestureRecognizer Command="{Binding SignUpClickCommand}"/>
                    </Label.GestureRecognizers>
                </Label>
            </StackLayout>
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

我的 AppShell 看起来像：

<?xml version="1.0" encoding="UTF-8"?>
<Shell xmlns="http://xamarin.com/schemas/2014/forms" 
       xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
       xmlns:d="http://xamarin.com/schemas/2014/forms/design"
       xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
       mc:Ignorable="d"
       xmlns:views="clr-namespace:App.Views"
       xmlns:loginViews="clr-namespace:App.Views.Login"
       x:Class="App.AppShell"
       FlyoutBehavior="Disabled">

    <!--Styles and Resources-->
    <Shell.Resources>
        <ResourceDictionary>
           ...removed due simplicity...
        </ResourceDictionary>
    </Shell.Resources>
    <ShellContent ContentTemplate="{DataTemplate loginViews:EnterEmailPage}"/>
</Shell>

所以，我的问题是 1. 如何在某些页面上动态隐藏后退按钮，在某些页面上不动态隐藏？对于导航我使用await Shell.Current.GoToAsync(route) 2.当用户离开应用程序时，我还需要重定向，并根据经过的时间再次输入，重定向到 preLogin 页面（登录）或让他直接到 postLogin（对应用程序的完全访问权限）所以我可能需要两个 AppShell 类，并将其称为不同的外壳 OnResume() ？

Answer 1

如何在某些页面上动态隐藏后退按钮而在某些页面上不动态隐藏？对于导航我使用 await Shell.Current.GoToAsync(route)

关于这个问题，这里有一个解决方法供您参考。

Shell 应用程序有 Back button behavior 可以动态地覆盖返回按钮，甚至可以隐藏/显示它。

如果使用Shell.Current.GoToAsync(route) 导航到目标页面，您可以按照以下代码在目标页面中使用。

// Button click to show Back Button
private void Button_Clicked_Show(object sender, EventArgs e)
{
    Shell.SetBackButtonBehavior(this, new BackButtonBehavior
    {
        IsEnabled = true
    });
}

// Button click to hide Back Button
private void Button_Clicked_Hide(object sender, EventArgs e)
{
    Shell.SetBackButtonBehavior(this, new BackButtonBehavior
    {
        IconOverride = "null.png", // null.png not exists in project ,just want 

显示空白返回按钮的程序 IsEnabled = 假 }); }

我会用 Gif 来展示效果：

当用户离开应用程序时，我还需要重定向，并根据经过的时间再次输入，重定向到 preLogin 页面（登录）或让他直接到 postLogin（对应用程序的完全访问权限），所以我可能需要两个 AppShell类，并将其称为不同的外壳 OnResume() ？

关于这个问题，这里有一个建议给你，你可以考虑是否符合你的需要。

您可以使用Navigation.PushModalAsync(new LoginPage()) 根据经过的时间重定向到预登录页面。否则使用 Shell.Current.GoToAsync(route) 导航。你可以在OnResume方法中处理它们。

例如如下：

protected override void OnResume()
{
    if(time > xxx)
    {
        Navigation.PushModalAsync(new LoginPage());
    }
    else
    {
        Shell.Current.GoToAsync(route);
    }
}

这里使用 PushModalAsyncto Login Page ，它是一个 Model Page 。使用Navigation.PopModalAsync() 后可以关闭LoginPage 并重定向到带有Shell.Current.GoToAsync(route) 的其他页面。