按鈕的動畫發光效果 - C＃Windows窗體

Question

我想在按下按鈕時將動畫應用到我的按鈕。在WPF中，我可以使用帶觸發器的Storyboard來創建動畫。這裏有一個例子：

<Storyboard x:Key="AniOpacityDelay"> 
    <DoubleAnimation 
    Storyboard.TargetName="background" 
    Storyboard.TargetProperty="Opacity" 
    AutoReverse="True" 
    To="0.65" 
    Duration="0:0:0.2"/> 
</Storyboard> 

和：

<ColorAnimationUsingKeyFrames 
    Storyboard.TargetName="Itemcont" 
    Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)"> 

    <EasingColorKeyFrame KeyTime="0" Value="#EEEEEE"/> 
</ColorAnimationUsingKeyFrames> 

Windows窗體不具有Storyboard和觸發器。如何在Windows窗體中製作流暢的動畫？

這裏是我的Windows窗體代碼：

void DelayTime() 
{ 
    timer = new Timer(); 
    timer.Interval = (int)System.TimeSpan.FromSeconds(this.DelayTime).TotalMilliseconds; 
    timer.Tick += (s, es) => 
    { 
    this.mouseover = false; 
    this.Cursor = Cursors.Hand; 
    this.Enabled = true; 
    }; 
    timer.Start(); 
} 

protected override void OnMouseDown(MouseEventArgs mevent) 
{ 
    base.OnMouseDown(mevent); 
    mouseover = true; 
    this.Enabled = false; 
    DelayTime(); 
} 

protected override void OnPaint(PaintEventArgs e) 
{ 
    Color bg = this._Background; 
    bg = mouseover ? this._HoverColor : this._Background; 
    e.Graphics.FillRectangle(new SolidBrush(bg), this.ClientRectangle); 
} 

Answer 1

主要想法是使用計時器和alphablending發光顏色與原始背景顏色。

例如，您可以將按鈕的FlatStyle設置爲Flat並覆蓋OnMouseEnter和OnMouseLeave。在OnMouseEnter啓動定時器，並在和OnMouseLeave停止計時器。在計時器Tick事件中，您可以將按鈕的FlatAppearance的MouseOverBackColor設置爲您在Tick事件中增加它的alpha通道的顏色。

發光按鈕代碼

using System; 
using System.Drawing; 
using System.Windows.Forms; 
public class GlowButton : Button 
{ 
    Timer timer; 
    int alpha = 0; 
    public Color GlowColor { get; set; } 
    public GlowButton() 
    { 
     this.DoubleBuffered = true; 
     timer = new Timer() { Interval = 50 }; 
     timer.Tick += timer_Tick; 
     this.FlatStyle = System.Windows.Forms.FlatStyle.Flat; 
     this.GlowColor = Color.Gold; 
     this.FlatAppearance.MouseDownBackColor = Color.Gold; 
    } 
    protected override void OnMouseEnter(EventArgs e) 
    { 
     base.OnMouseEnter(e); 
     this.FlatAppearance.MouseOverBackColor = CalculateColor(); 
     timer.Start(); 
    } 
    protected override void OnMouseLeave(EventArgs e) 
    { 
     base.OnMouseLeave(e); 
     timer.Stop(); 
     alpha = 0; 
     this.FlatAppearance.MouseOverBackColor = CalculateColor(); 
    } 
    void timer_Tick(object sender, EventArgs e) 
    { 
     int increament = 25; 
     if (alpha + increament < 255) { alpha += increament; } 
     else { timer.Stop(); alpha = 255; } 
     this.FlatAppearance.MouseOverBackColor = CalculateColor(); 
    } 
    protected override void Dispose(bool disposing) 
    { 
     if (disposing) timer.Dispose(); 
     base.Dispose(disposing); 
    } 
    private Color CalculateColor() 
    { 
     return AlphaBlend(Color.FromArgb(alpha, GlowColor), this.BackColor); 
    } 
    public Color AlphaBlend(Color A, Color B) 
    { 
     var r = (A.R * A.A/255) + (B.R * B.A * (255 - A.A)/(255 * 255)); 
     var g = (A.G * A.A/255) + (B.G * B.A * (255 - A.A)/(255 * 255)); 
     var b = (A.B * A.A/255) + (B.B * B.A * (255 - A.A)/(255 * 255)); 
     var a = A.A + (B.A * (255 - A.A)/255); 
     return Color.FromArgb(a, r, g, b); 
    } 
} 

Answer 2

你會得到的WinForms最近可能是使它DoubleBuffered。 WinForms對動畫不太好。

如果您使用的是自定義控件，請在Initialize（）下添加該控件;

SetStyle(ControlStyles.OptimizedDoubleBuffer, true); 

否則，請在屬性DoubleBuffered的形式，或通過代碼：

DoubleBuffered = true; 

然後創建動畫（如果你還沒有想通了這一點），做一個循環檢查，如果動畫完成（在計時器事件中）。