【问题标题】:FlyoutPage on Xamarin formx 5.0Xamarin formx 5.0 上的 FlyoutPage
【发布时间】:2021-04-16 23:03:29
【问题描述】:

Om Xamarin Forms 我们使用此代码创建母版页:

 <MasterDetailPage.ToolbarItems>
        <ToolbarItem Priority="0" Order="Secondary" Text="{x:DynamicResource MasterPageControls}" Command="{Binding ControlsCommand}" />
        <ToolbarItem Priority="1" Order="Secondary" Text="{x:DynamicResource Refresh}" Command="{Binding RefreshCommand}" />
        <ToolbarItem Priority="2" Order="Secondary" Text="{x:DynamicResource About}" Command="{Binding AboutCommand}" />
        <ToolbarItem Priority="4" Order="Secondary" Text="{x:DynamicResource Logout}" Command="{Binding LogoutCommand}"/>
    </MasterDetailPage.ToolbarItems>
    <MasterDetailPage.Master>
        <NavigationPage Title="Title" IconImageSource="hamburger.png">
            <x:Arguments>
                <ContentPage Title="Menu" 
                             BackgroundColor="White"
                             NavigationPage.HasNavigationBar="False">
 ....
                </ContentPage>
            </x:Arguments>
        </NavigationPage>
    </MasterDetailPage.Master>

现在我将我的代码迁移到 5.0 版并像这样更改它 (from this link):

 <FlyoutPage.ToolbarItems>
        <ToolbarItem Priority="0" Order="Secondary" Text="{x:DynamicResource MasterPageControls}" />
        <ToolbarItem Priority="1" Order="Secondary" Text="{x:DynamicResource Refresh}" />
        <ToolbarItem Priority="2" Order="Secondary" Text="{x:DynamicResource About}" />
        <ToolbarItem Priority="4" Order="Secondary" Text="{x:DynamicResource Logout}"/>
    </FlyoutPage.ToolbarItems>
    <FlyoutPage.Flyout>
        <NavigationPage Title="Title" IconImageSource="hamburger.png">
            <x:Arguments>
                <ContentPage Title="Menu" 
                             BackgroundColor="White"
                             NavigationPage.HasNavigationBar="False">
               ...
                </ContentPage>
            </x:Arguments>
        </NavigationPage>
    </FlyoutPage.Flyout>

注册:

           containerRegistry.RegisterForNavigation<NavigationPage>("NavigationPage");
            containerRegistry.RegisterForNavigation<PrismMasterDetailPage, PrismMasterDetailPageViewModel>("MasterPage");
            containerRegistry.RegisterForNavigation<MainPage, MainPageViewModel>();

和导航:

 await NavigationService.NavigateAsync("/MasterPage/NavigationPage/MainPage");

当我尝试运行应用程序时,我得到了这个异常: Flyout 和 Detail 必须在使用 FlyoutPage 之前设置

我应该对我的代码进行哪些更改才能使其正常工作(它应该显示在右侧 MasterPage 和屏幕 MainPage 的中心)?

编辑: 我通过添加登录页面来更改我的代码。它在 App.xaml.cs 上运行,就像这样:

 await NavigationService.NavigateAsync($"/NavigationPage/{nameof(LoginPage)}");

在 LoginPageViewModel 上,我已将命令绑定到我运行方法以导航到 MainPage 的按钮。在 Xamarin.Forms 4.8 中,我们使用该命令:

await NavigationService.NavigateAsync("/MasterPage/NavigationPage/MainPage",
                    new NavigationParameters {{nameof(LoginPageViewModel), string.Empty}});

但是现在当我使用它时,导航不起作用(没有任何异常或类似的想法):(

当我从名称中删除 /MasterPage 时,我导航到 MainPage 但我没有 MasterPage

编辑 2: 我将代码表单使用 FlyoutPage 更改为 MasterDetailPage 并开始工作,但 MasterDetailPage 在 xamarin 表单 5 中已过时

【问题讨论】:

    标签: xamarin.forms prism


    【解决方案1】:

    Prism 8 不支持 FlyoutPage。您可以阅读更多相关信息 herehere

    【讨论】:

    • 是的,但 MasterDetailPage 在 XamarinForms 5 上已过时:(
    • 好的,我将代码更改为使用过时的 MasterDetailPage 并开始工作
    • 这只是一个警告,它已过时,但您仍然可以使用它,直到 Prism 更新到 8.1。否则,您将无法使用 FlyoutPage 和 Prism 8.0 进行导航。
    • 是的,我需要等待 8.1
    【解决方案2】:

    因为错误显示Flyout and Detail must be set before using a FlyoutPage

    尝试在 FlyoutPage xaml 中也设置FlyoutPage.Detail

     <FlyoutPage.Flyout>
            <NavigationPage Title="Title" IconImageSource="hamburger.png">
                <x:Arguments>
                    <ContentPage Title="Menu" 
                                 BackgroundColor="White"
                                 NavigationPage.HasNavigationBar="False">
                   ...
                    </ContentPage>
                </x:Arguments>
            </NavigationPage>
        </FlyoutPage.Flyout>
    
    <FlyoutPage.Detail>
        <NavigationPage>
          <x:Arguments>
            <pages:FlyoutPage1Detail />
          </x:Arguments>
        </NavigationPage>
      </FlyoutPage.Detail>
        
    
    

    参考https://docs.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/navigation/flyoutpage#create-a-flyoutpage

    【讨论】:

    • 我通过在 FlyoutPage 之前使用 LoginPage 来更改代码中的一些想法。请看我的编辑帖子
    • 好的,你能发布你的解决方法并将其标记为答案吗?
    【解决方案3】:

    实际上 Prism 8 不支持 FlyoutPage,所以当我回到:

     <MasterDetailPage.ToolbarItems>
            <ToolbarItem Priority="0" Order="Secondary" Text="{x:DynamicResource MasterPageControls}" Command="{Binding ControlsCommand}" />
            <ToolbarItem Priority="1" Order="Secondary" Text="{x:DynamicResource Refresh}" Command="{Binding RefreshCommand}" />
            <ToolbarItem Priority="2" Order="Secondary" Text="{x:DynamicResource About}" Command="{Binding AboutCommand}" />
            <ToolbarItem Priority="4" Order="Secondary" Text="{x:DynamicResource Logout}" Command="{Binding LogoutCommand}"/>
        </MasterDetailPage.ToolbarItems>
        <MasterDetailPage.Master>
            <NavigationPage Title="Title" IconImageSource="hamburger.png">
                <x:Arguments>
                    <ContentPage Title="Menu" 
                                 BackgroundColor="White"
                                 NavigationPage.HasNavigationBar="False">
     ....
                    </ContentPage>
                </x:Arguments>
            </NavigationPage>
        </MasterDetailPage.Master>
    

    它开始工作,但我有警告,因为 MasterDetailPage 已过时但工作:) 我需要等待 Prism 8.1 并将 MasterDetailPage 迁移到 FlyoutPage

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2021-11-13
      • 1970-01-01
      • 1970-01-01
      • 2021-07-01
      • 2022-01-04
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多