WPF中,在实现一个动画还原时,遇到了问题,在我的项目中我希望某个按钮鼠标移入时以动画形式放大至原来的1.5倍,当鼠标移出时再以动画的形式回到原始状态
在C#中定义了一个AnimationHelper类:
public class AnimationHelper { /// <summary> /// 弹簧式放大 /// </summary> /// <param name="element"></param> public static void ScaleEasingInAnimation(FrameworkElement element) { ScaleTransform scale = new ScaleTransform(); element.RenderTransform = scale; element.RenderTransformOrigin = new Point(0.5, 0.5);//定义圆心位置 EasingFunctionBase easing = new ElasticEase() { EasingMode = EasingMode.EaseOut, //公式 Oscillations = 5, //抖动次数 Springiness = 10 //弹簧刚度 }; DoubleAnimation scaleAnimation = new DoubleAnimation() { //From = 1, //起始值 To = 1.5, //结束值 EasingFunction = easing, //缓动函数 Duration = new TimeSpan(0, 0, 0, 1, 200), //动画播放时间 FillBehavior = FillBehavior.HoldEnd //动画完成时保持为终值 }; AnimationClock clock = scaleAnimation.CreateClock(); scale.ApplyAnimationClock(ScaleTransform.ScaleXProperty, clock, HandoffBehavior.Compose); scale.ApplyAnimationClock(ScaleTransform.ScaleYProperty, clock, HandoffBehavior.Compose); } /// <summary> /// 弹簧式缩小 /// </summary> /// <param name="element"></param> public static void ScaleEasingOutAnimation(FrameworkElement element) { ScaleTransform scale = new ScaleTransform(); element.RenderTransform = scale; element.RenderTransformOrigin = new Point(0.5, 0.5); DoubleAnimation ani = new DoubleAnimation() { To = 1, Duration = new TimeSpan(0, 0, 0, 1, 0) }; AnimationClock clock = ani.CreateClock(); scale.ApplyAnimationClock(ScaleTransform.ScaleXProperty, clock, HandoffBehavior.Compose); scale.ApplyAnimationClock(ScaleTransform.ScaleYProperty, clock, HandoffBehavior.Compose); } }
同时,我还有这样一个UserControl:
public partial class MyImageButton : UserControl {
public MyImageButton(ImageSource source) { InitializeComponent(); } private void btn_MouseEnter(object sender, MouseEventArgs e) { this.Cursor = Cursors.Hand; Button btn = (Button)sender; AnimationHelper.ScaleEasingInAnimation(btn); } private void btn_MouseLeave(object sender, MouseEventArgs e) { Button btn = (Button)sender; AnimationHelper.ScaleEasingOutAnimation(btn); } }
现在的问题是,当我鼠标移入时,动画能正常播放,但是当鼠标移出时,控件直接变为Scale为1的状态,没有实现动画,请问这里的问题出在哪里呢?
我是新手,没多少豆,还望大大解答。
你在缩小动画中
ScaleTransform scale = new ScaleTransform();
element.RenderTransform = scale;// 这里new了一个ScaleTransform,新的ScaleTransform的ScaleX和ScaleY都等于1。To 也等于1,From跟To相等,所以没有动画效果
原来是这样,感谢您的回答,问题已经解决了。