How to programmatically navigate in FlipView using swipe animations

The Windows Dev Center specifies the UseTouchAnimationsForAllNavigation property:

The XAML FlipView control supports three navigation modes; touch, button and software. When the user moves with a touch, the FlipView elements smoothly go into view mode. When you set this property to true, the same navigation animation occurs if the navigation is touch-based, based on buttons and soft.

I am currently navigating from my page code by assigning the SelectedItem property to FlipView:

 FlipView.SelectedItem = FlipView.Items.Last(); 

However, the swipe animation is not displayed. How to enable it?

+6
source share
5 answers

Meanwhile, I was able to solve this problem. I have a button that starts navigation to the next FlipViewItem. However, this button has been placed in FlipViewItem.

With my setup (touch device) nothing worked. Then I tried to click the button with the mouse, and it worked. After I turned off UseTouchAnimationsForAllNavigation , it also worked using touch input. In my tests, I placed the button outside of FlipView, and it worked using animations.

Here's the problem: when the button is pressed, the navigation animation tries to start ( SelectedIndex installed correctly), but stopped because the user is blocking the animation while still touching the button. Thus, the navigation is canceled, and SelectionChanged reports the current page.

The solution is to set the ManipulationMode buttons to All . After that, you cannot flip FlipViewItem at the touch of a button, but the animation runs and works like a spell.

+10
source

I solved the same problem differently. As Chliebel said, this is because your finger is still in control, so flipview cannot come to life. So I took a short break after the trip. By the time the user releases the finger and it works !!!

  await Task.Delay(100); flipView.SelectedIndex += 1; 
+2
source

For me, ChristiaanV's answer helped:

Animation only happens when moving to the previous or next item in FlipView.

So, I set up the while loop to set the selected index to the previous / next, until I get to the desired page.

Code example:

If you want to go to the first page:

 while(flipView.SelectedIndex > 0) { flipView.SetValue(FlipView.SelectedIndexProperty, flipView.SelectedIndex - 1); } 
0
source

Here's a compact solution similar to Bhawk1990's:

 //nb is the index you wish to get to. if (nb > flipview.SelectedIndex) while (flipview.SelectedIndex != nb) flipview.SelectedIndex++; else if (nb < flipview.SelectedIndex) while (flipview.SelectedIndex != nb) flipview.SelectedIndex--; 
0
source

I spent a couple of days understanding why touch animation doesnโ€™t work when I programmatically change the selected FlipView element when UseTouchAnimationsForAllNavigation="True" .

I found a setting that controls the animation machine. Somehow this setting was disabled:

 Settings->Visual options->Play animations in Windows 
-2
source

All Articles