Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to programmatically navigate in a FlipView with swipe animations

The Windows Dev Center states regarding the UseTouchAnimationsForAllNavigation property:

The XAML FlipView control supports three modes of navigation; touch-based, button-based and programmatic. When a user navigates by touch, the FlipView items scroll smoothly into view. When you set this property to true, the same navigation animation occurs whether the navigation is touch-based, button-based and programmatic.

I'm currently navigating from my page's code behind by assigning the SelectedItem property of the FlipView:

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

However, the swipe animation does not show. How can I enable it?

like image 453
christianliebel Avatar asked Jan 23 '14 10:01

christianliebel


1 Answers

Meanwhile, I was able to solve this problem. I have a button that triggers the navigation to the next FlipViewItem. This button however was placed in a FlipViewItem.

With my setup (touch device), nothing happend. Then I tried clicking the button with the mouse and it worked. After I disabled UseTouchAnimationsForAllNavigation, it also worked using touch input. In my tests, I placed the button outside of the FlipView and it did work using animations.

Here's the problem: When tapping the button, the navigation animation tries to start (SelectedIndex is set correctly), but stopped because the user blocks the animation by still touching the button. So, the navigation is cancelled and SelectionChanged reports the current page.

The solution is to set ManipulationMode of the Button to All. After that, you can't flip the FlipViewItem when touching the button, but the animation executes and it works like charm.

like image 199
christianliebel Avatar answered Oct 03 '22 23:10

christianliebel