Je veux déplacer animer un objet rectangle pour le déplacer dans l'axe des x. Je suis nouveau dans l'animation WPF, a commencé avec ce qui suit:
<Storyboard x:Key="MoveMe">
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00"
Storyboard.TargetName="GroupTileSecond"
Storyboard.TargetProperty="(**Margin.Left**)">
<SplineDoubleKeyFrame KeyTime="00:00:00" Value="**134, 70,0,0**" />
<SplineDoubleKeyFrame KeyTime="00:00:03" Value="**50, 70,0,0**" />
</DoubleAnimationUsingKeyFrames>
</Storyboard>
De toute évidence, je ne peux pas utiliser Margin.Left
comme Storyboard.TargetProperty
Ou utiliser 134,70,0,0
dans la propriété Value.
Alors, comment déplacer un objet dans XAML WPF.
Margin
la propriété peut être animée à l'aide de ThicknessAnimation
<Storyboard >
<ThicknessAnimationUsingKeyFrames Storyboard.TargetProperty="Margin" BeginTime="00:00:00">
<SplineThicknessKeyFrame KeyTime="00:00:00" Value="134, 70,0,0" />
<SplineThicknessKeyFrame KeyTime="00:00:03" Value="50, 70,0,0" />
</ThicknessAnimationUsingKeyFrames>
</Storyboard>
Vous ne pouvez pas animer Margin.Left (car Left
n'est pas une propriété de dépendance), mais vous pouvez animer Margin
. Utilisez ObjectAnimationUsingKeyFrames
:
<Storyboard x:Key="MoveMe">
<ObjectAnimationUsingKeyFrames BeginTime="00:00:00"
Storyboard.TargetName="GroupTileSecond"
Storyboard.TargetProperty="Margin">
<DiscreteObjectKeyFrame KeyTime="00:00:00">
<DiscreteObjectKeyFrame.Value>
<Thickness>134,70,0,0</Thickness>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
<DiscreteObjectKeyFrame KeyTime="00:00:03">
<DiscreteObjectKeyFrame.Value>
<Thickness>50,70,0,0</Thickness>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
Il existe des alternatives qui vous permettent d'utiliser un DoubleAnimation
, plutôt que des images clés:
Canvas.Left
.TranslateTransform
à votre cible et animez sa position x à l'aide de TranslateTransform.X
.Comme réponse alternative @McGarnagle
vous pouvez utiliser l'animation pour les propriétés HorizontalAlignment
et VerticalAlignment
.
Exemple:
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="GroupTileSecond"
Storyboard.TargetProperty="HorizontalAlignment">
<DiscreteObjectKeyFrame KeyTime="0:0:0">
<DiscreteObjectKeyFrame.Value>
<HorizontalAlignment>Center</HorizontalAlignment>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
je viens de créer une animation. code ci-dessous
using System;
using System.Windows;
using System.Windows.Media.Animation;
namespace ImagesSwitcher
{
class MarginAnimation : AnimationTimeline
{
protected override Freezable CreateInstanceCore()
{
return new MarginAnimation();
}
public override Type TargetPropertyType => typeof(Thickness);
private double GetContrast(double dTo,double dFrom,double process)
{
if (dTo < dFrom)
{
return dTo + (1 - process) * (dFrom - dTo);
}
return dFrom + (dTo - dFrom) * process;
}
public override object GetCurrentValue(object defaultOriginValue, object defaultDestinationValue, AnimationClock animationClock)
{
if (!From.HasValue || !To.HasValue || animationClock.CurrentProgress == null) return null;
var progress = animationClock.CurrentProgress.Value;
if (progress.Equals(0)) return null;
if (progress.Equals(1)) return To.Value;
var fromValue = From.Value;
var toValue = To.Value;
var l = GetContrast(toValue.Left ,fromValue.Left, progress);
var t = GetContrast(toValue.Top, fromValue.Top, progress);
var r = GetContrast(toValue.Right, fromValue.Right, progress);
var b = GetContrast(toValue.Bottom, fromValue.Bottom, progress);
return new Thickness(l,t,r,b);
}
public Thickness? To
{
set => SetValue(ToProperty, value);
get => (Thickness)GetValue(ToProperty);
}
public static DependencyProperty ToProperty = DependencyProperty.Register("To", typeof(Thickness), typeof(MarginAnimation), new PropertyMetadata(null));
public Thickness? From
{
set => SetValue(FromProperty, value);
get => (Thickness)GetValue(FromProperty);
}
public static DependencyProperty FromProperty = DependencyProperty.Register("From", typeof(Thickness), typeof(MarginAnimation), new PropertyMetadata(null));
}
}