Florent
Florent

Reputation: 137

UWP MVVM NavigationView BackButton - Detect when it is pressed

This question is in the context of using MVVM pattern. I have a NavigationView in my XAML but I have no way to detect when the user clicks on the back button. I could do it in the code behind file easily but that doesnt seems like what you want to do in an MVVM context. So is there a way to detect when the user presses the back button from a NavigationView outside of the code behind cs file? I would attach a Command Object to it and use my NavigationService where I will be able to switch the Frame. So far I use the Behaviors NuGet package to detect the clicks on the MenuItems but it doesnt work for the BackButton. Here is the Xaml so far:

<Page
    x:Class="ToolBoxApp.Views.AudioHomeView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:ToolBoxApp.Views"
    xmlns:viewmodels="using:ToolBoxApp.ViewModels"
    xmlns:mainview="clr-namespace:ToolBoxApp"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:i="using:Microsoft.Xaml.Interactivity"
    xmlns:core="using:Microsoft.Xaml.Interactions.Core"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    
    <Grid>
        <NavigationView x:Name="navigationViewControl" 
                        IsBackEnabled="true">

            <i:Interaction.Behaviors>
                <core:EventTriggerBehavior EventName="ItemInvoked">
                    <core:EventTriggerBehavior.Actions>
                        <core:InvokeCommandAction Command="{Binding NavigateToView}" />
                    </core:EventTriggerBehavior.Actions>
                </core:EventTriggerBehavior>
            </i:Interaction.Behaviors>

            <NavigationView.MenuItems>
                <NavigationViewItem Icon="MusicInfo" Content="Text to Speech"/>
                <NavigationViewItem Icon="MusicInfo" Content="Youtube to Mp3"/>
            </NavigationView.MenuItems>

            <ScrollViewer>
                <Frame SourcePageType="{Binding ScrollAudioView, Mode=TwoWay}"/>
            </ScrollViewer>

        </NavigationView>
    </Grid>
</Page>

Upvotes: 0

Views: 167

Answers (1)

mm8
mm8

Reputation: 169280

Why don't you simply add another EventTriggerBehavior that invokes another command for the BackRequested event?:

<i:Interaction.Behaviors>
    <core:EventTriggerBehavior EventName="BackRequested">
        <core:EventTriggerBehavior.Actions>
            <core:InvokeCommandAction Command="{Binding BackCommand}" />
        </core:EventTriggerBehavior.Actions>
    </core:EventTriggerBehavior>

    <core:EventTriggerBehavior EventName="ItemInvoked">
        <core:EventTriggerBehavior.Actions>
            <core:InvokeCommandAction Command="{Binding NavigateToView}" />
        </core:EventTriggerBehavior.Actions>
    </core:EventTriggerBehavior>
</i:Interaction.Behaviors>

Upvotes: 2

Related Questions