动画计数器控件

• 下载演示项目 - 21.8 Kb
• 下载源代码 - 24.1 Kb

引言

计数器是一个 C# 控件，它使用位图中的数字显示一个值。控件资源中包含 13 个主题，但可以添加其他主题。当 ToValue 属性更改时，计数器将开始移动。当数字更改时，会发生“下落”动画效果。可以从默认的 1000（1 秒）更改递增/递减值的计时器间隔。动画速度和显示的数字数量也可以更改。当计数器 Value 等于 ToValue 时，会引发 CounterFinish 事件。

计数器的另一个主题

代码

C# 控件类 Counter 继承自 System.Windows.Forms.UserControl。它重写了 OnPaintBackground 方法来绘制自身。

protected override void OnPaintBackground(
        System.Windows.Forms.PaintEventArgs e)
{
    try 
    {
        for(int i=0; i!=DigitCount; i++) 
        {
            e.Graphics.DrawImage(
              (digits[i] as CounterDigit).DigitBitmap, 
              i * digitWidth, 0);
        }
    } 
    catch {}
}

控件中有两个计时器。主计时器用于递增/递减 Value，使其接近 ToValue。另一个计时器 - 动画计时器 - 用于动画化数字以获得“下落”效果。

private void animationTimer_Tick(object source, EventArgs e)
{
    for(int i=0; i!=DigitCount; i++) 
    {
        CounterDigit cd = digits[i] as CounterDigit;
        cd.NextFrame();
    }
    Invalidate();
}

每个数字帧都会移动到下一个帧，直到到达最后一个帧并停止动画。之后，控件将被使无效，以强制重新绘制自身。

有一个额外的辅助类 CounterDigit 用于数字表示。

在特定时刻显示的图像取决于用于动画效果的 Frame 属性。它是从当前数字和前一个数字构建的。

public Bitmap DigitBitmap 
{
    get 
    {
        Graphics g = Graphics.FromImage(framedDigitBitmap);
        try 
        {
            g.DrawImage(
              numbersBitmap, 0, 0, 
              new Rectangle(Digit * width, frames - Frame, width, frames), 
              GraphicsUnit.Pixel);
            g.DrawImage(
               numbersBitmap, 0, Frame, 
               new Rectangle( PrevDigit * width, 0, width, frames - Frame + 2), 
               GraphicsUnit.Pixel);
        }
        finally 
        {
            g.Dispose();
        }
        return framedDigitBitmap;
    }
}

用于调整外观和行为的属性

有一些属性可以修改计数器控件的外观和行为

• Value - 是控件中显示的值
• ToValue - 是计数器想要达到的值
• DigitCount - 是显示的数字数量。例如，对于 5 和值 34，控件将显示 00034
• TimerInterval - 是自动值更新之间的间隔，用于递增/递减计数器到 ToValue 属性
• AnimationSpeed - 是数字下落动画的速度
• NumbersTheme - 是用于显示数字的主题。可以从控件资源中嵌入的 13 个预定义位图中选择。

最后的想法

计数器是一个外观不错的控件，这是它的主要优点。我构建它是为了展示如何实现一个简单的动画效果。为了真正有用，该控件可能需要进行一些修改。玩得开心！

历史

• 2003 年 9 月 1 日 - 更新了源代码