XAML .NET MAUI -Flyout汉堡菜单问题

xt0899hw  于 2023-09-28  发布在  .NET
关注(0)|答案(1)|浏览(153)

我正在开发.NET MAUI移动的应用程序。我在AppShell. xaml中使用Flyout Item创建了一个汉堡菜单。我的应用程序从一个登录页面开始,当用户登录时,会出现一个主页。在а登录页面弹出按钮被禁用,它是活跃的,只有在主页和其他网页,可访问登录的用户.在汉堡菜单中有一个Home按钮,其想法是当用户在应用程序中的某个位置时能够返回到主页。问题是汉堡菜单中的Home按钮只工作一次->用户返回主页。当我在应用程序的某个地方,并试图再次回来,什么也没有发生。
下面是我的AppShell.xamp代码

<Shell
    xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:WTO.MobileApp.Views.Pages"
    x:Class="WTO.MobileApp.AppShell"
    FlyoutBackgroundColor="White"
    Shell.FlyoutBehavior="Flyout">
    
    <ShellContent
        Title="Welcome"
        ContentTemplate="{DataTemplate local:WelcomePage}"
        FlyoutItemIsVisible="False"
        Route="WelcomePage" />
    
    <FlyoutItem Title="Home" 
                Icon="houseicon.png">
        <Tab>
            <ShellContent Route="HomePage" 
                      ContentTemplate="{DataTemplate local:HomePage}" />
        </Tab>
        
    </FlyoutItem>
    <FlyoutItem Title="My Profile" 
                Icon="accounticon.png">
        <Tab>
            <ShellContent Route="MyQuotesPage" 
                      ContentTemplate="{DataTemplate local:MyQuotesPage}" />
        </Tab>
        
    </FlyoutItem>
    <FlyoutItem Title="Support" 
                Icon="help.png">
        <Tab>
            <ShellContent Route="SupportPage" 
                      ContentTemplate="{DataTemplate local:AllShipmentsPage}" />
        </Tab>
        
    </FlyoutItem>
    <FlyoutItem Title="About Us"
                Icon="info.png">
        <Tab>
            <ShellContent Route="AboutUsPage" 
                      ContentTemplate="{DataTemplate local:AboutUsPage}" />
        </Tab>
        
    </FlyoutItem>
</Shell>

这里是我的主页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:views="clr-namespace:WTO.MobileApp.Views.ContentViews"
             x:Class="WTO.MobileApp.Views.Pages.HomePage"
             BackgroundColor="White"
             Shell.NavBarIsVisible="False"
             Title="HomePage">
    <ScrollView>
        <Grid>
            <Grid Grid.Row="0">
                <!--this is the background image with the overlay-->
                <Image Grid.Row="1" Source="asset.png"
               Aspect="AspectFit"         
               MaximumHeightRequest="400"
               Margin="0,50"
               VerticalOptions="StartAndExpand"
               HorizontalOptions="StartAndExpand"
               Opacity="0.06"/>
            </Grid>
            <Grid Grid.Row="1" RowDefinitions="*,8*,2*">
                <views:Header Grid.Row="0" VerticalOptions="StartAndExpand"/>
                <Grid Grid.Row="1" RowDefinitions="*,3*,*">
                    <Grid Grid.Row="1" RowDefinitions="*,*,*" Padding="30,0">
                        <ImageButton Grid.Row="0"
                             Source="allshipmentsbtn.png"
                             Command="{Binding GoToAllShipmentsPageCommand}"
                             HorizontalOptions="CenterAndExpand"
                             Margin="0"/>
                        <ImageButton Grid.Row="1"
                             Source="myquotesbtn.png"
                             Command = "{Binding GoToMyQuotesPageCommand}"
                             HorizontalOptions="CenterAndExpand"
                             Margin="0"/>
                        <ImageButton Grid.Row="2"
                             Source="newquotesbtn.png"
                             Command = "{Binding GoToNewQuotePageCommand}"
                             HorizontalOptions="CenterAndExpand"
                             Margin="0"/>
                    </Grid>
                </Grid>
            </Grid>
        </Grid>
    </ScrollView>
</ContentPage>

例如,当用户单击All Shipments - >时,会命中GoToAllShipmentsPageCommand。导航到AllShipments是这样的- await Shell.Current.GoToAsync(“AllShipmentsPage”);

e7arh2l6

e7arh2l61#

问题是汉堡菜单中的Home按钮只工作一次->用户返回主页。当我在应用程序的某个地方,并试图再次回来,什么也没有发生。
我可以复制你的问题。如果你想一直把home键保留在汉堡菜单里。在“Support”弹出菜单项中,将“Route”更改为Route="AllShipmentsPage"。这将确保三个平台的一致性:Android、iOS和Windows。
请参考下面的代码:

<FlyoutItem Title="Support" 
                Icon="dotnet_bot.png">
     <Tab>
            <ShellContent Route="AllShipmentsPage" 
                      ContentTemplate="{DataTemplate local:AllShipmentsPage}" />
     </Tab>
</FlyoutItem>
async void GoToAllShipmentsPage()
{
    await Shell.Current.GoToAsync($"//{nameof(AllShipmentsPage)}");
}

相关问题