UWP 导航视图消失答案

【问题标题】：UWP Navigation View disappearedUWP 导航视图消失
【发布时间】：2018-08-10 19:48:59
【问题描述】：

我有带有 3 个按钮的 NavigationView

<NavigationView x:Name="nvTopLevelNav"
            Margin="0,0,0,0"
            ItemInvoked="nvTopLevelNav_ItemInvoked"
            IsTabStop="False"
            AlwaysShowHeader="False"
            VerticalContentAlignment="Stretch" 
            HorizontalContentAlignment="Stretch" 
            VerticalAlignment="Stretch" 
            Grid.RowSpan="1" 
            Grid.Row="1" 
            Grid.Column="1" 
            Grid.ColumnSpan="1"
            Padding="0,0,0,0" >
        <NavigationView.MenuItems>
            <NavigationViewItem Tag="Nav_BlankPage1" VerticalContentAlignment="Center">
                <TextBlock Tag="Nav_BlankPage1" Text="Nav_BlankPage1" />
            </NavigationViewItem>
            <NavigationViewItem Tag="Nav_BlankPage2" VerticalContentAlignment="Center">
                <TextBlock Tag="Nav_BlankPage2"   Text="Nav_BlankPage2"/>
            </NavigationViewItem>
            <NavigationViewItem Tag="Nav_BlankPage3" VerticalContentAlignment="Center">
                <TextBlock Tag="Nav_BlankPage3"   Text="Nav_BlankPage3" />
            </NavigationViewItem>
        </NavigationView.MenuItems>
        <Frame x:Name="MainFrame" 
           Grid.Column="1" 
           Grid.Row="1"
           VerticalContentAlignment="Stretch" VerticalAlignment="Stretch" Padding="0,0,0,0">
            <RelativePanel Grid.Column="0"
                   Grid.Row="1">
             </RelativePanel>
        </Frame>
    </NavigationView>

MainPage 后面的代码：

private void nvTopLevelNav_ItemInvoked(NavigationView sender, NavigationViewItemInvokedEventArgs args)
{
    if (args.IsSettingsInvoked)
    {
    }
    else
    {
        TextBlock ItemContent = args.InvokedItem as TextBlock;
        if (ItemContent != null)
        {
            switch (ItemContent.Tag)
            {
                case "Nav_BlankPage1":
                    MainFrame.Navigate(typeof(BlankPage1));

                    break;
                case "Nav_BlankPage2":
                    MainFrame.Navigate(typeof(BlankPage2));

                    break;
                case "Nav_BlankPage3":
                    MainFrame.Navigate(typeof(BlankPage3));

                    break;
                case "Nav_Settings":

                    break;
            }
        }
    }
}

每个页面都有 3 个按钮（第一个是后面的代码）：

private void btnBlankPage1_Click(object sender, RoutedEventArgs e)
{
    var _frame = (Frame)Window.Current.Content;
    _frame.Navigate(typeof(BlankPage1));
}

如果我使用NavigationView 按钮一切都很好，但如果我使用页面上的按钮NavigationView 就会消失。

你能澄清一下吗？

【问题讨论】：

我找到了一种方法：在 MainPage: public static Frame GlobalFrame;并在构造函数 GlobalFrame = MainFrame;以后只使用 GlobalFrame。但这看起来不是一个好方法。无论如何它都有效。

标签： uwp

【解决方案1】：

原因是您使用了错误的Frame 导航。在您的情况下，UI 树看起来像这样：

窗口
- 框架
  - 导航视图页面
    - 主机
      - 页面

当您浏览NavigationView 菜单时，一切正常，因为您使用的是内部MainFrame。但是，在另一页上，您将 Frame 放在 Window ((Frame)Window.Current.Content) 的根目录中并在其中导航。这将导航离开包含NavigationView 的页面并在其位置导航到BlankPage1，因此NavigationView 消失了。

相反，您必须在NavigationView 中使用MainFrame 进行导航。最简单的方法是将Frame 属性添加到包含NavigationView 的页面，然后将其用于导航：

public static Frame AppFrame { get; private set; }

并在页面构造函数中分配它：

AppFrame = MainFrame;

现在你用它来导航：

NavigationViewPage.AppFrame.Navigate(typeof(BlankPage1));

其中NavigationViewPage 是包含NavigationView 的页面

最后一个说明 - 你不必为发布问题而道歉，这就是这个网站的目的 ;-)。

【讨论】：