##效果图 
<!-- lang: c# -->
public partial class MainPage
{
private readonly TranslateTransform _translation;
private Storyboard _thumbStoryboard;
private readonly DoubleAnimation _dragAnimation = new DoubleAnimation();
private readonly CompositeTransform _thumbTransform = new CompositeTransform();
// 构造函数
public MainPage()
{
InitializeComponent();
_translation = new TranslateTransform();
}
private void LayoutRoot_ManipulationStarted(object sender, System.Windows.Input.ManipulationStartedEventArgs e)
{
}
private void LayoutRoot_ManipulationDelta(object sender, System.Windows.Input.ManipulationDeltaEventArgs e)
{
}
private void LayoutRoot_ManipulationCompleted(object sender, System.Windows.Input.ManipulationCompletedEventArgs e)
{
Debug.WriteLine("translation:" + e.TotalManipulation.Translation.X);
UpdateUserInterface(e.TotalManipulation.Translation.X < 0 ? -130 : 0);
}
private void UpdateUserInterface(double offset)
{
var dragItem = DragPanel as FrameworkElement;
if (_thumbStoryboard == null)
{
// 确保所有子元素都刷新
UpdateLayout();
dragItem.RenderTransform = _thumbTransform;
// 指定变换的原点
dragItem.RenderTransformOrigin = new Point(0.5d, 0.5d);
// 设置动画的target
Storyboard.SetTarget(_dragAnimation, _thumbTransform);
// 将TranslateX作为变换的
Storyboard.SetTargetProperty(_dragAnimation, new PropertyPath("TranslateX"));
//使用QuinticEase缓动效果
_dragAnimation.EasingFunction = new QuinticEase { EasingMode = EasingMode.EaseOut };
_thumbStoryboard = new Storyboard();
//设置动画时间
_dragAnimation.Duration = new Duration(TimeSpan.FromMilliseconds(500));
//添加动画到storyboard
_thumbStoryboard.Children.Add(_dragAnimation);
}
// 计算动画结束的位置
double newPos = _translation.X + offset;
//设置动画结束点到新的位置
_dragAnimation.To = newPos;
// 开始动画
_thumbStoryboard.Begin();
}
}
