<!--#region 子框架进入动画--> <Storyboard x:Name="childrenInStoryboard" x:FieldModifier="public"> <DoubleAnimationUsingKeyFrames x:Name="childrenInDA" Storyboard.TargetName="RootGrid" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)"> <EasingDoubleKeyFrame KeyTime="0" Value="0"/> <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0"> <EasingDoubleKeyFrame.EasingFunction> <QuarticEase EasingMode="EaseIn"/> </EasingDoubleKeyFrame.EasingFunction> </EasingDoubleKeyFrame> </DoubleAnimationUsingKeyFrames> </Storyboard> <!--#endregion--> <!--#region 子框架退出动画--> <Storyboard x:Name="childrenOutStoryboard" x:FieldModifier="public"> <DoubleAnimationUsingKeyFrames x:Name="childrenOutDA" Storyboard.TargetName="RootGrid" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)"> <EasingDoubleKeyFrame KeyTime="0" Value="0"/> <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="0"> <EasingDoubleKeyFrame.EasingFunction> <QuarticEase EasingMode="EaseInOut"/> </EasingDoubleKeyFrame.EasingFunction> </EasingDoubleKeyFrame> </DoubleAnimationUsingKeyFrames> </Storyboard> <!--#endregion-->
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" Name="RootGrid" Loaded="RootGrid_Loaded"> <Grid.RenderTransform> <CompositeTransform/> </Grid.RenderTransform> </Grid>
这个是XAML;我使用手机的后退按钮来退出
这里的Frame是我在MainPage中定义的一个名字为childrenFrame的Frame,从mainpage的listboxItem跳转的。下面是后台代码:
public sealed partial class SafePage : Page { public SafePage() { this.InitializeComponent(); SystemNavigationManager.GetForCurrentView().BackRequested += SafePage_BackRequested; childrenOutStoryboard.Completed += ChildrenOutStoryboard_Completed; } private void ChildrenOutStoryboard_Completed(object sender, object e) { tempE = false; Frame.Visibility = Visibility.Collapsed; Frame.BackStack.Clear(); (RootGrid.RenderTransform as CompositeTransform).TranslateX = 0; } //声明一个Bool值 bool tempE = true; /// <summary> /// 退出动画 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void SafePage_BackRequested(object sender, BackRequestedEventArgs e) { e.Handled = tempE; if (!Frame.CanGoBack) {
//Tools.ScreenSize().Width是一个自定义方法用来获取手机屏幕的实际分辨率 childrenOutDA.KeyFrames[1].Value = Tools.ScreenSize().Width; childrenOutStoryboard.Begin(); } else { Frame.GoBack(); } } /// <summary> /// 载入动画 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void RootGrid_Loaded(object sender, RoutedEventArgs e) {
//Tools.ScreenSize().Width是一个自定义方法用来获取手机屏幕的实际分辨率 childrenInDA.KeyFrames[0].Value = Tools.ScreenSize().Width; childrenInStoryboard.Begin(); } }
本来我的想法是页面进入 :从右进入。页面退出:再原路退回去
但是第二次开始退出动画就变成进入效果了,现在都还是懵逼的。
1.动画应该用在childrenFrame上。
2.BackRequested事件应该写在mainpage里而不是SafePage里
3.而且这个SystemNavigationManager用+=就该在不需要的时候-=,应为这个是系统级别的实际。
具体解决办法,可以看看我的博客http://www.cnblogs.com/Enious/p/5858333.html