Change visual state with button

Question

I'm currently developing an app on UWP platform, even though its not of high importance since its school work only, I wish to make some smooth transitions at menu opening. I made two states of menu but I just can't figure out how to change state when "open menu" button is pressed, does anyone have any idea how to do that?

BTW menu is an StackPanel, hope I choose it rights

Thanks for your time

Answer 1

I believe this should do the trick:

Add these to the owning window/page/control:

xmlns:i="using:Microsoft.Xaml.Interactivity"
xmlns:core="using:Microsoft.Xaml.Interactions.Core"

And set the button as such:

 <Button x:Name="TheButton"
                Content="Transition">

            <i:Interaction.Behaviors>

                <core:EventTriggerBehavior EventName="Click">

                    <core:GoToStateAction StateName="TheStateToMoveTo"
                                          TargetObject="{Binding ElementName=NameOfTheObjectWithTheStates}"
                                          UseTransitions="True" />

                </core:EventTriggerBehavior>

            </i:Interaction.Behaviors>

        </Button>

The event should be caught by the trigger and the behavior should make the state transition occur.