如何编写Silverlight动画效果控件

如何编写Silverlight动画效果控件

作为开发人员我一直存在2个问题,相信很多人也有这样的问题:

1、 懒惰,为了实现一些Silverlight特殊效果要写烦乱的XAML语句,这太可怕了;

2、 因为不是设计人员,很难做出一些非常美观的界面

于是,我就写了EffectControls控件集,目的是用最短的时间和最短的代码实现很酷的控件效果。开放源码,欢迎您的使用和改进,如果有好玩的特效,请一定要通知我。

 

 

在线演示地址
http://crmwin.com/EffectControlsTestPage.html

 

源代码下载:

Open Source Web Address:
http://www.CrmWin.com
Blog address:

写一下我的设计思路吧,希望您能有更好的改进版本,请也给我一份哦

我的联系方式:

Name:   王昕

Mail:  475660@QQ.com or StarSuit@gmail.com

Mobile:  13710637136

首先:编写EffectControlHelper帮助类,这个类帮助我们创建各种效果:

 

View Code
public class EffectControlHelper

{

public static void DropShadowEffect(object control, string EffectType, Color EffectColor,

double EffectRadius, double EffectDirection, double EffectOpacity, double EffectShadowDepth)

{

DropShadowEffect Effect 
= new DropShadowEffect();

Random r 
= new Random();



List
<Color> colors = new List<Color>();

colors.Add(Colors.Black);

colors.Add(Colors.Blue);

colors.Add(Colors.Brown);

colors.Add(Colors.Cyan);

colors.Add(Colors.DarkGray);

colors.Add(Colors.Gray);

colors.Add(Colors.Green);

colors.Add(Colors.LightGray);

colors.Add(Colors.Magenta);

colors.Add(Colors.Orange);

colors.Add(Colors.Purple);

colors.Add(Colors.Red);

colors.Add(Colors.White);

colors.Add(Colors.Yellow);

colors.Add(Colors.Blue);

colors.Add(Colors.Green);

colors.Add(Colors.Red);

colors.Add(Colors.Yellow);



Color RandomColor 
= colors[r.Next(18)];



if (EffectType == "DropShadowMovedEffect")

{

Effect.Direction 
= r.Next(180);

Effect.Color 
= EffectColor;

}

else

{

Effect.Color 
= EffectColor;

}



if (EffectType == "RandomColor")

{

Effect.Color 
= RandomColor;

}



Effect.Direction 
= EffectDirection;

Effect.BlurRadius 
= EffectRadius;

Effect.Opacity 
= EffectOpacity;

Effect.ShadowDepth 
= EffectShadowDepth;

(control 
as FrameworkElement).Effect = Effect;

}



public static void EffectMouseEnter(object control, string EffectType, double EffectRadius)

{

if (EffectType == "FadeEffect")

{

Storyboard stb 
= StoryboardHelper.FadeOutFrameworkElement(control as FrameworkElement, .50);



if (stb != null)

{

stb.Begin();

}



}



if (EffectType == "BlurEffect")

{

(control 
as FrameworkElement).Effect = new BlurEffect() { Radius = EffectRadius };



}



if (EffectType == "DropShadowEffect")

{

(control 
as FrameworkElement).Effect = null;

}



}



public static void EffectMouseLeave(object control, string EffectType)

{





if (EffectType == "FadeEffect")

{

Storyboard fadeInRect 
= StoryboardHelper.FadeInFrameworkElement(control as FrameworkElement, .20);

if (fadeInRect != null)

{

fadeInRect.Begin();

}



}



if (EffectType == "JumpEffect")

{

Storyboard stb1 
= StoryboardHelper.JumpUpFrameworkElement(control as FrameworkElement, .50, (control as FrameworkElement).Height);



if (stb1 != null)

{

stb1.Begin();

}



}



if (EffectType == "JumpLeftEffect")

{

Storyboard stb1 
= StoryboardHelper.JumpLeftFrameworkElement(control as FrameworkElement, .50, (control as FrameworkElement).Height);



if (stb1 != null)

{

stb1.Begin();

}



}



(control 
as FrameworkElement).Effect = null;

}



public static void LoadedEffect(object control, string EffectType)

{



if (EffectType == "UnderLineEffect")

{

(control 
as Control).BorderThickness = new Thickness(0002);

(control 
as Control).Effect = null;

}



if (EffectType == "NoBorderLineEffect")

{

(control 
as Control).BorderThickness = new Thickness(0000);

(control 
as Control).BorderBrush =null;

(control 
as Control).Effect = null;

}



if (EffectType == "RotationX1Effect")

{

PlaneProjection ppj 
= new PlaneProjection();

ppj.RotationX 
= -45;

ppj.CenterOfRotationY 
= 0.1;

(control 
as Control).Projection = ppj;

}

if (EffectType == "RotationX2Effect")

{

PlaneProjection ppj 
= new PlaneProjection();

ppj.RotationX 
= 45;

ppj.CenterOfRotationY 
= 0.1;

(control 
as Control).Projection = ppj;

}

if (EffectType == "RotationY1Effect")

{

PlaneProjection ppj 
= new PlaneProjection();

ppj.RotationY 
= -45;

ppj.CenterOfRotationX 
= 0.1;

(control 
as Control).Projection = ppj;

}

if (EffectType == "RotationY2Effect")

{

PlaneProjection ppj 
= new PlaneProjection();

ppj.RotationY 
= 45;

ppj.CenterOfRotationX 
= 0.1;

(control 
as Control).Projection = ppj;

}

if (EffectType == "RotationZ1Effect")

{

PlaneProjection ppj 
= new PlaneProjection();

ppj.RotationZ 
= -5;

(control 
as Control).Projection = ppj;

}

if (EffectType == "RotationZ2Effect")

{

PlaneProjection ppj 
= new PlaneProjection();

ppj.RotationZ 
= 5;

(control 
as Control).Projection = ppj;

}

}







}

其中有StoryboardHelper帮助类,是辅助动画生成的类

 

代码如下:

 

public class StoryboardHelper

    {

        public static Storyboard ProjectiontAction(Control Control, Double duration, Double delay, double height)

        {

            // Create the animation

            DoubleAnimation AnimationUp = new DoubleAnimation();

 

            // Set the values that the animation starts and ends with

 

            AnimationUp.From = 30;

 

            AnimationUp.To = 0;

 

            // Set the time the animation is to begin

            AnimationUp.BeginTime = TimeSpan.FromSeconds(delay);

 

            // Set the duration of the animation

            AnimationUp.Duration = new Duration(TimeSpan.FromSeconds(duration));

 

            // Set the target of the animation

            Storyboard.SetTarget(AnimationUp, Control);

 

            // Set the property the animation is to affect

            Storyboard.SetTargetProperty(AnimationUp, new PropertyPath(Control.ProjectionProperty));

 

            // Create a new storyboard

            Storyboard stb = new Storyboard();

 

            // Add the animation to the storyboard

            stb.Children.Add(AnimationUp);

 

            // Set return variable to the new storyboard

            return stb;

        }


View Code
public static Storyboard JumpUpFrameworkElement(FrameworkElement frameworkElement, Double duration, Double delay, double height)

{

// Create the animation

DoubleAnimation AnimationUp 
= new DoubleAnimation();



// Set the values that the animation starts and ends with



AnimationUp.From 
= 0;





AnimationUp.To 
= height;



if (height < 23)

{

AnimationUp.To 
= 23;

}



// Set the time the animation is to begin

AnimationUp.BeginTime 
= TimeSpan.FromSeconds(delay);



// Set the duration of the animation

AnimationUp.Duration 
= new Duration(TimeSpan.FromSeconds(duration));



// Set the target of the animation

Storyboard.SetTarget(AnimationUp, frameworkElement);



// Set the property the animation is to affect

Storyboard.SetTargetProperty(AnimationUp, 
new PropertyPath(FrameworkElement.HeightProperty));



// Create a new storyboard

Storyboard stb 
= new Storyboard();



// Add the animation to the storyboard

stb.Children.Add(AnimationUp);



// Set return variable to the new storyboard

return stb;

}



public static Storyboard JumpLeftFrameworkElement(FrameworkElement frameworkElement, Double duration, Double delay, double width)

{





// Create the animation

DoubleAnimation AnimationUp 
= new DoubleAnimation();



// Set the values that the animation starts and ends with



AnimationUp.From 
= 0;



AnimationUp.To 
= width;



if (width < 150)

{

AnimationUp.To 
= 150;

}



// Set the time the animation is to begin

AnimationUp.BeginTime 
= TimeSpan.FromSeconds(delay);



// Set the duration of the animation

AnimationUp.Duration 
= new Duration(TimeSpan.FromSeconds(duration));



// Set the target of the animation

Storyboard.SetTarget(AnimationUp, frameworkElement);



// Set the property the animation is to affect

Storyboard.SetTargetProperty(AnimationUp, 
new PropertyPath(FrameworkElement.WidthProperty));



// Create a new storyboard

Storyboard stb 
= new Storyboard();



// Add the animation to the storyboard

stb.Children.Add(AnimationUp);



// Set return variable to the new storyboard

return stb;

}













public static Storyboard ColorChange(Control control, Double duration, Double delay, Color from, Color to,string property)

{



System.Windows.Media.Animation.ColorAnimation Animation 
= new System.Windows.Media.Animation.ColorAnimation();

Animation.From 
= from;

Animation.To 
= to;





SolidColorBrush myAnimatedBrush 
= new SolidColorBrush();

myAnimatedBrush.Color 
= from;



if (property == "Background")

{

(control 
as Button).Background = myAnimatedBrush;

}

if (property == "Foreground")

{

(control 
as Button).Foreground = myAnimatedBrush;

}



//page.RegisterName("MyAnimatedBrush", myAnimatedBrush);





Storyboard.SetTargetName(Animation, 
"MyAnimatedBrush");

// Set the property the animation is to affect





Storyboard.SetTargetProperty(

Animation, 
new PropertyPath(SolidColorBrush.ColorProperty));



// Set the time the animation is to begin

Animation.BeginTime 
= TimeSpan.FromSeconds(delay);



// Set the duration of the animation

Animation.Duration 
= new Duration(TimeSpan.FromSeconds(duration));



// Set the target of the animation

Storyboard.SetTarget(Animation, control);



// Create a new storyboard

Storyboard stb 
= new Storyboard();



// Add the animation to the storyboard

stb.Children.Add(Animation);



// Set return variable to the new storyboard

return stb;

}



public static Storyboard FadeInFrameworkElement(FrameworkElement frameworkElement, Double duration, Double delay)

{

// Create the animation

DoubleAnimation Animation 
= new DoubleAnimation();



// Set the values that the animation starts and ends with

Animation.From 
= 0.3;

Animation.To 
= 1;



// Set the time the animation is to begin

Animation.BeginTime 
= TimeSpan.FromSeconds(delay);



// Set the duration of the animation

Animation.Duration 
= new Duration(TimeSpan.FromSeconds(duration));



// Set the target of the animation

Storyboard.SetTarget(Animation, frameworkElement);



// Set the property the animation is to affect

Storyboard.SetTargetProperty(Animation, 
new PropertyPath(FrameworkElement.OpacityProperty));



// Create a new storyboard

Storyboard stb 
= new Storyboard();



// Add the animation to the storyboard

stb.Children.Add(Animation);



// Set return variable to the new storyboard

return stb;

}



public static Storyboard FadeOutFrameworkElement(FrameworkElement frameworkElement, Double duration, Double delay)

{

// Create the animation

DoubleAnimation FadeOutAnimation 
= new DoubleAnimation();



// Set the values that the animation starts and ends with

FadeOutAnimation.From 
= 1;

FadeOutAnimation.To 
= 0.3;



// Set the time the animation is to begin

FadeOutAnimation.BeginTime 
= TimeSpan.FromSeconds(delay);



// Set the duration of the animation

FadeOutAnimation.Duration 
= new Duration(TimeSpan.FromSeconds(duration));



// Set the target of the animation

Storyboard.SetTarget(FadeOutAnimation, frameworkElement);



// Set the property the animation is to affect

Storyboard.SetTargetProperty(FadeOutAnimation, 
new PropertyPath(FrameworkElement.OpacityProperty));



// Create a new storyboard

Storyboard FadeInTBSB 
= new Storyboard();



// Add the animation to the storyboard

FadeInTBSB.Children.Add(FadeOutAnimation);



// Set return variable to the new storyboard

return FadeInTBSB;

}

    }

 

 

然后,定义扩展的控件,比如EffectButton,是从Button继承的

比如要在鼠标进入时增加效果。

我们可以这样写:

 

        void Effect_MouseEnter(object sender, MouseEventArgs e)

        {

            EffectControlHelper.EffectMouseEnter(sender, EffectType, EffectRadius);

        }

使用帮助

首先要在页面中加入引用:

例如:

xmlns:efcs="clr-namespace:EffectControls;assembly=EffectControlsLibrary"

DropShadowEffect

用于控件阴影的显示

使用方法:

1

                <efcs:EffectButton EffectType="DropShadowEffect"

                         Content="DropShadowEffect" >

                </efcs:EffectButton>

2

                <efcs:EffectTextBox EffectType="DropShadowEffect" EffectColor="Red" EffectRadius="10" EffectDirection="30" EffectOpacity="0.6" EffectShadowDepth="5"

                         Text="CustomDropShadow" Height="23" HorizontalAlignment="Left" Margin="10,10,0,0"  VerticalAlignment="Top" Width="125" >

                </efcs:EffectTextBox>

               

                   

 

效果

正常状态:

http://images.cnblogs.com/cnblogs_com/FreeForm/305772/r_image002.jpg

BlurEffect

使用方法:

1

                <efcs:EffectCheckBox EffectType="BlurEffect" EffectRadius="2"

                         Content="BlurEffect" >

                </efcs:EffectCheckBox>

 

2

<efcs:EffectLabel EffectType="BlurEffect" EffectRadius="2"

                         Content="BlurEffect" >

                </efcs:EffectLabel>

 

效果:

正常状态:

http://images.cnblogs.com/cnblogs_com/FreeForm/305772/r_image003.jpg

鼠标经过:

 

其他效果也是类似的,请看帮助文档。

 

源代码下载:

Open Source Web Address:
http://www.CrmWin.com
关于作者: 王昕(QQ:475660) 在广州工作生活30余年。十多年开发经验,在Java、即时通讯、NoSQL、BPM、大数据等领域较有经验。
目前维护的开源产品:https://gitee.com/475660
原文地址:https://www.cnblogs.com/starcrm/p/2084440.html