有时候我们需要编写一些迎合IOS用户使用习惯的uwp应用,我在这里整理一下仿IOS页面切换效果的代码。先分析IOS的页面切换。用户使用左右滑动方式进行前进和后退,播放类似于FlipView的切换动画。导航到新页面时,使用页面前进的动画。UWP自带很多切换效果,位于 Windows ...
有时候我们需要编写一些迎合IOS用户使用习惯的uwp应用,我在这里整理一下仿IOS页面切换效果的代码。
先分析IOS的页面切换。用户使用左右滑动方式进行前进和后退,播放类似于FlipView的切换动画。导航到新页面时,使用页面前进的动画。
UWP自带很多切换效果,位于 Windows.UI.Xaml.Media.Animation 中。与苹果的切换效果最接近的是 PaneThemeTransition (而不是EdgeUIThemeTransition)。
PaneThemeTransition的效果是从它的Edge属性规定的方位平移进入,从Edge属性规定的方位平移退出。
苹果的切换方式是:
新建和前进:从右边平移进入,从左边平移退出。
返回:从左边平移进入,从右边平移退出。
分析完这些,大致的实现步骤就明了了。
在页面初始化时添加PaneThemeTransition
在进入动画播放前判断导航方式并设定Edge属性。不考虑刷新这种情况,如果是返回就是Left,否则是Right。
在退出动画播放前判断导航方式并设定Edge属性。不考虑刷新这种情况,如果是返回就是Right,否则是Left。
照这个思路写出来的代码是这样的:
1 Imports Windows.UI.Xaml.Media.Animation 2 ''' <summary> 3 ''' 移植苹果的应用时使用。这种页面自带苹果导航动画和手势。 4 ''' </summary> 5 Public MustInherit Class AppleAnimationPage 6 Inherits Page 7 Dim PaneAnim As New PaneThemeTransition With {.Edge = EdgeTransitionLocation.Right} 8 Sub New() 9 MyBase.New10 Transitions = New TransitionCollection11 Transitions.Add(PaneAnim)
原标题:在uwp仿IOS的页面切换效果
关键词:IOS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。