将汉堡框架留在UWP中

时间:2016-02-06 10:31:25

标签: c# windows-phone-8 uwp

我是UWP开发的新手。我想创建一个简单的应用程序来显示一些数据。我为我的应用程序的第一部分创建了一个汉堡菜单,效果很好。但是,在您选择页面后,它会显示在我使用SplitViews创建的汉堡菜单中的框架上。

<RelativePanel Background="{StaticResource AccentBrush}">
        <Button Name="HamburgerButton" FontFamily="Segoe MDL2 Assets" Content="&#xE700;" FontSize="36" Click="HamburgerButton_Click" />
        <TextBlock Name="TitleTextBlock" RelativePanel.RightOf="HamburgerButton" Margin="10,0,0,0" Text="Contentedor" FontSize="36" />
    </RelativePanel>
    <SplitView Name="MySplitView" Grid.Row="1" DisplayMode="CompactOverlay" OpenPaneLength="240" CompactPaneLength="56" HorizontalAlignment="Left">
        <SplitView.Pane>
            <ListBox SelectionMode="Single" 
                     Background="DimGray"
                     Name="IconsListBox" 
                     SelectionChanged="IconsListBox_SelectionChanged">
                <ListBoxItem Name="ContainerListBoxItem">
                    <StackPanel Orientation="Horizontal">
                        <!--<TextBlock FontFamily="Segoe MDL2 Assets" FontSize="36" Text="&#xE72D;" />-->
                        <Image HorizontalAlignment="Left" Source="Assets/icon1.png" Width="35" Height="35" />
                        <TextBlock Margin="20,0,0,0" Text="Page1" FontSize="24" />
                    </StackPanel>
                </ListBoxItem>
                <ListBoxItem Name="AnimalListBoxItem">
                    <StackPanel Orientation="Horizontal">
                        <!--<TextBlock FontFamily="Segoe MDL2 Assets" FontSize="36" Text="&#xE734;" />-->
                        <Image HorizontalAlignment="Left" Source="Assets/icon2.png" Width="35" Height="35" />
                        <TextBlock Margin="20,0,0,0" Text="Page2" FontSize="24" />
                    </StackPanel>
                </ListBoxItem>
                <ListBoxItem Name="SettingsListBoxItem">
                    <StackPanel Orientation="Horizontal">
                        <!--<TextBlock FontFamily="Segoe MDL2 Assets" FontSize="36" Text="&#xE72D;" />-->
                        <Image HorizontalAlignment="Left" Source="Assets/icon3.png" Width="35" Height="35" />
                        <TextBlock Margin="20,0,0,0" Text="Page3" FontSize="24" />
                    </StackPanel>
                </ListBoxItem>
            </ListBox>
        </SplitView.Pane>
        <SplitView.Content>
            <Frame Name="MyFrame" />
        </SplitView.Content>
    </SplitView>

当我点击icon1时,我转到了page1。没关系。但后来我有一个列表,我想导航到一个新页面,显示该列表中任何元素的信息。如果我这样做,我仍然会看到框架内的信息。是否有可能出去打开一个新的(全窗口)页面?我导航到新页面的方式是:     Frame.Navigate(typeof运算(pages.ContainerDetail));

我的问题是第二页未正确显示,因为汉堡包菜单右侧不在手机屏幕内。

我不知道是否还有其他方法可以做到。

1 个答案:

答案 0 :(得分:0)

打开一个新窗口(WinRT称之为视图)比它应该更复杂一些。这是它在Template 10中的实现方式。

  

https://github.com/Windows-XAML/Template10/blob/master/Template10%20(Library)/Services/NavigationService/NavigationService.cs#L175

public async Task OpenAsync(Type page, object parameter = null, string title = null, ViewSizePreference size = ViewSizePreference.UseHalf)
{
    DebugWrite($"Page: {page}, Parameter: {parameter}, Title: {title}, Size: {size}");

    var currentView = ApplicationView.GetForCurrentView();
    title = title ?? currentView.Title;

    var newView = CoreApplication.CreateNewView();
    var dispatcher = new DispatcherWrapper(newView.Dispatcher);
    await dispatcher.DispatchAsync(async () =>
    {
        var newWindow = Window.Current;
        var newAppView = ApplicationView.GetForCurrentView();
        newAppView.Title = title;

        var nav = BootStrapper.Current.NavigationServiceFactory(BootStrapper.BackButton.Ignore, BootStrapper.ExistingContent.Exclude);
        nav.Navigate(page, parameter);
        newWindow.Content = (nav as INavigationServiceInternal).FrameFacade.Frame;
        newWindow.Activate();

        await ApplicationViewSwitcher
            .TryShowAsStandaloneAsync(newAppView.Id, ViewSizePreference.Default, currentView.Id, size);
    });
}

我希望你能偷走这些代码。

祝你好运。