UWP NavigationView在特定的“全屏”页面上隐藏NavPane

时间:2018-07-18 05:23:00

标签: xaml uwp uwp-xaml

我有一个非常基本的带有框架的NavigationView:

      stopPlaying();
      mp = MediaPlayer.create(PlayaudioActivity.this, R.raw.ok); //R.raw.ok is new audio file
      mp.start();

     private void stopPlaying() {
        if (mp != null) {
            mp.stop();
            mp.release();
            mp = null;
       }
    }

最简单的EventHandler:

<NavigationView
    x:Name="navigationView"
    AlwaysShowHeader="False"
    SelectionChanged="{x:Bind ViewModel.OnSelectionChanged}">
    <Grid>
        <Frame x:Name="shellFrame" />
    </Grid>
</NavigationView>

当您导航到“正在播放”时,我希望与 Groove Music 中的操作相同-NavPane隐藏,并且只有appbackbutton可用。 我当前的解决方案是在FullscreenPage上捕获OnNavigatedTo和OnNavigatedFrom事件,并更改NavigationView.CompactPaneLength和NavigationView.OpenPaneLength:

public async void OnSelectionChanged(NavigationView sender, NavigationViewSelectionChangedEventArgs args)
    {
        var item = args.SelectedItem as NavigationViewItem;

        // I'm using Prism framework, by the way...
        navigationService.Navigate(item.Tag.ToString(), null);
    }

它可以按预期工作,但是当NavigationView“崩溃”时会有些冻结。 也许有更好的解决方案?

1 个答案:

答案 0 :(得分:0)

  

导航到“正在播放”时,我希望获得与Groove音乐相同的效果

NavigationView显示在主页的框架中,其中包含ContentFrame,用于显示FirstPageSecondPage。如果要显示PlayPage并隐藏NavigationView,最好的方法是在PlayPage中显示MainPageFrame,就像下面的图片一样。

enter image description here

当您从PlayPage返回到MainPage时,NavigationView将自动显示,并且您无需处理NavigationView的复杂动画。请参考以下代码。

public MainPage()
{
    this.InitializeComponent();

}     
protected override void OnNavigatedTo(NavigationEventArgs e)
{
    if (e.NavigationMode == NavigationMode.Back)
    {

        foreach(NavigationViewItemBase item in NvTest.MenuItems)
        {
          if((string) item.Tag == contentFrame.CurrentSourcePageType.Name)
            {
                SelectItem = item;
            }
        }
    }
    Windows.UI.Core.SystemNavigationManager.GetForCurrentView().AppViewBackButtonVisibility = AppViewBackButtonVisibility.Collapsed;
    base.OnNavigatedTo(e);
}

private NavigationViewItemBase selectItem;

public event PropertyChangedEventHandler PropertyChanged;
public void OnPropertyChanged([CallerMemberName] string propertyName = null)
{      
    this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}

public NavigationViewItemBase SelectItem
{
    get
    {
        return selectItem;
    }
    set
    {
        selectItem = value;
        OnPropertyChanged();
    }
}


private void NvTest_SelectionChanged(NavigationView sender, NavigationViewSelectionChangedEventArgs args)
{
    var selectedItem = (NavigationViewItem)args.SelectedItem;
    string pageName = "App14." + ((string)selectedItem.Tag);
    if ((string)selectedItem.Tag == "PlayPage")
    {
        this.Frame.Navigate(Type.GetType(pageName));

    }
    else
    {
        sender.Header = pageName;
        Type pageType = Type.GetType(pageName);
        contentFrame.Navigate(pageType);              
    }

}

MainPage.xaml

<Grid>
    <NavigationView x:Name="NvTest" SelectionChanged="NvTest_SelectionChanged" SelectedItem="{x:Bind SelectItem,Mode=TwoWay}">
        <NavigationView.MenuItems>
            <NavigationViewItem Icon="Play" Content="Menu Item1" Tag="SamplePage1" />
            <NavigationViewItemSeparator/>
            <NavigationViewItem Icon="Save" Content="Menu Item2" Tag="PlayPage" />
            <NavigationViewItem Icon="Save" Content="Menu Item3" Tag="SamplePage2" />

        </NavigationView.MenuItems>
        <Frame x:Name="contentFrame"/>
    </NavigationView>
</Grid>

这是code sample