FlipView crashes when touched

Question

In the Windows Store app

Xaml

<Page x:Class="FunctionTest.BlankPage1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:FunctionTest" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"> <Page.Resources> <Storyboard x:Name="FloatingFlipOver"> <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.GlobalOffsetZ)" Storyboard.TargetName="FloatingRoot"> <EasingDoubleKeyFrame KeyTime="0" Value="-2000"/> <EasingDoubleKeyFrame KeyTime="0:0:0.8" Value="0"> <EasingDoubleKeyFrame.EasingFunction> <QuarticEase/> </EasingDoubleKeyFrame.EasingFunction> </EasingDoubleKeyFrame> </DoubleAnimationUsingKeyFrames> <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)" Storyboard.TargetName="FloatingRoot"> <EasingDoubleKeyFrame KeyTime="0" Value="180"/> <EasingDoubleKeyFrame KeyTime="0:0:0.8" Value="0"> <EasingDoubleKeyFrame.EasingFunction> <QuarticEase/> </EasingDoubleKeyFrame.EasingFunction> </EasingDoubleKeyFrame> </DoubleAnimationUsingKeyFrames> <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="FloatingRoot"> <EasingDoubleKeyFrame KeyTime="0" Value="0"/> <EasingDoubleKeyFrame KeyTime="0:0:0.2" Value="1"/> </DoubleAnimationUsingKeyFrames> </Storyboard> </Page.Resources> <Grid> <Grid x:Name="FloatingRoot" Visibility="Collapsed" Width="500" Height="300"> <Grid.Projection> <PlaneProjection CenterOfRotationX="0.5" CenterOfRotationY="0.5"/> </Grid.Projection> <Rectangle x:Name="FloatingBackground" Fill="SkyBlue" /> <FlipView> <Grid x:Name="FloatingContainer" Width="300" Height="300"> </Grid> </FlipView> </Grid> <Button Content="Test" HorizontalAlignment="Left" Margin="46,36,0,0" VerticalAlignment="Top" Click="Test_Click"/> </Grid> </Page> 

code

 private void Test_Click(object sender, RoutedEventArgs e) { Button msiBtn = new Button(); msiBtn.Content = "addBtn"; msiBtn.Width = 100; msiBtn.Height = 50; msiBtn.Tapped += msiBtn_Tapped; FloatingContainer.Children.Add(msiBtn); FloatingRoot.Opacity = 0; FloatingRoot.Visibility = Visibility.Visible; FloatingFlipOver.Begin(); } void msiBtn_Tapped(object sender, TappedRoutedEventArgs e) { FloatingRoot.Visibility = Visibility.Collapsed; FloatingContainer.Children.Clear(); } 

This works when used with the mouse, but it will crash when I touch the button that is added to the FloatingContainer, sometimes even when I touch the FloatingContainer (and not the button), it also crashes. This is mistake?

Answer 1

I think you meant crash, not crash, right? Because this is what I see.

Known bug related to ScrollViewers and projections. I'm not sure if this has been publicly discussed, but one of the workarounds I heard about it works for me in the WinRT XAML Toolkit (in FlipAnimation), it seems to work in your case, since FlipView has a ScrollViewer as part of its template . Basically you need to change ZoomMode ScrollViewer to something else and back again, and then it works without crashing. To fix the code from your snippet, I referenced the WinRT XAML Toolkit to use VisualTreeHelperExtensions, which helps to extract the ScrollViewer and change the ZoomMode back and forth after the animation is completed, as shown below:

 using WinRTXamlToolkit.Controls.Extensions; using Windows.UI.Xaml; using Windows.UI.Xaml.Controls; using Windows.UI.Xaml.Input; namespace App96 { public sealed partial class MainPage : Page { public MainPage() { this.InitializeComponent(); } private void Test_Click(object sender, RoutedEventArgs e) { Button msiBtn = new Button(); msiBtn.Content = "addBtn"; msiBtn.Width = 100; msiBtn.Height = 50; msiBtn.Tapped += msiBtn_Tapped; FloatingContainer.Children.Add(msiBtn); FloatingRoot.Opacity = 0; FloatingRoot.Visibility = Visibility.Visible; FloatingFlipOver.Begin(); FloatingFlipOver.Completed -= FloatingFlipOver_Completed; FloatingFlipOver.Completed += FloatingFlipOver_Completed; } void FloatingFlipOver_Completed(object sender, object e) { foreach (var sv in FloatingRoot.GetDescendantsOfType<ScrollViewer>()) { sv.ZoomMode = (ZoomMode)(((int)sv.ZoomMode + 1) % 2); sv.ZoomMode = (ZoomMode)(((int)sv.ZoomMode + 1) % 2); } } void msiBtn_Tapped(object sender, TappedRoutedEventArgs e) { FloatingRoot.Visibility = Visibility.Collapsed; FloatingContainer.Children.Clear(); } } } 

The corresponding VisualTreeHelperExtensions bit, which you can use if you don't need the entire Toolkit:

 public static class VisualTreeHelperExtensions { public static IEnumerable<T> GetDescendantsOfType<T>(this DependencyObject start) where T : DependencyObject { return start.GetDescendants().OfType<T>(); } public static IEnumerable<DependencyObject> GetDescendants(this DependencyObject start) { var queue = new Queue<DependencyObject>(); var count = VisualTreeHelper.GetChildrenCount(start); for (int i = 0; i < count; i++) { var child = VisualTreeHelper.GetChild(start, i); yield return child; queue.Enqueue(child); } while (queue.Count > 0) { var parent = queue.Dequeue(); var count2 = VisualTreeHelper.GetChildrenCount(parent); for (int i = 0; i < count2; i++) { var child = VisualTreeHelper.GetChild(parent, i); yield return child; queue.Enqueue(child); } } } }