制作Windows下的ProgressBar组件

一、效果图

二、代码实现

2.1 新建组件库TS，在库中新增组件TSProgressBar。

2.2 代码如下：

[ToolboxItem(true)] [ToolboxBitmap(typeof(System.Windows.Forms.ProgressBar))] public partial class TSProgressBar : Label { //public TSProgressBar(IContainer container) //{ // container.Add(this); // InitializeComponent(); //} private const int m_MaxBarWidth = 20; private const int m_MaxBarSpace = 10; private int m_Value = 0; private int m_Maximum = 100; private int m_ProgressBarBlockWidth = 6; private int m_ProgressBarBlockSpace = 1; /// <summary> /// 是否显示进度值 /// </summary> private bool m_ShowProgressBarPercent = true; private bool m_ProgressBarMarginOffset = true; private TProgressBarBorderStyle m_ProgressBarBorderStyle = TProgressBarBorderStyle.Flat; private SolidBrush m_ProgressBarFillBrush; public TSProgressBar() { InitializeComponent(); m_ProgressBarFillBrush = new SolidBrush(Color.LimeGreen); base.BackColor = Color.White; base.ForeColor = Color.Blue; base.AutoSize = false; // AutoSize is Designer Attribute base.TextAlign = ContentAlignment.MiddleCenter; // TextAlign is Designer Attribute } //protected override void Dispose(bool disposing) //{ // try // { // if (disposing) // { // // release managed resource // } // m_ProgressBarFillBrush.Dispose(); // release unmanaged resource // } // finally // { // base.Dispose(disposing); // } //} #region custom or modified properties [Category("Custom")] [Description("Set/Get progress bar fill color.")] [DefaultValue(typeof(Color), "White")] public Color ProgressBarFillColor { get { return m_ProgressBarFillBrush.Color; } set { if (m_ProgressBarFillBrush.Color != value) { m_ProgressBarFillBrush.Color = value; this.Invalidate(); } } } [Category("Custom")] [Description("Set/Get progress small bar width.")] [DefaultValue(6)] public int ProgressBarBlockWidth { get { return m_ProgressBarBlockWidth; } set { if (m_ProgressBarBlockWidth != value) { if (value < 1) { m_ProgressBarBlockWidth = 1; } else if (value > m_MaxBarWidth) { m_ProgressBarBlockWidth = m_MaxBarWidth; } else { m_ProgressBarBlockWidth = value; } this.Invalidate(); } } } [Category("Custom")] [Description("Set/Get progress bar space width(smooth when 0).")] [DefaultValue(1)] public int ProgressBarBlockSpace { get { return m_ProgressBarBlockSpace; } set { if (m_ProgressBarBlockSpace != value) { if (value < 0) { m_ProgressBarBlockSpace = 0; } else if (value > m_MaxBarSpace) { m_ProgressBarBlockSpace = m_MaxBarSpace; } else { m_ProgressBarBlockSpace = value; } this.Invalidate(); } } } [Category("Custom")] [Description("Set/Get progress bar boder style.")] [DefaultValue(typeof(TProgressBarBorderStyle), "Flat")] public TProgressBarBorderStyle ProgressBarBoderStyle { get { return m_ProgressBarBorderStyle; } set { if (m_ProgressBarBorderStyle != value) { m_ProgressBarBorderStyle = value; this.Invalidate(); } } } [Category("Custom")] [Description("Set/Get show percent text or not.")] [DefaultValue(true)] public bool ShowProgressBarPercent { get { return m_ShowProgressBarPercent; } set { if (m_ShowProgressBarPercent != value) { m_ShowProgressBarPercent = value; this.Invalidate(); } } } [Category("Custom")] [Description("Set/Get if progress bar has margin offset.")] [DefaultValue(true)] public bool ProgressBarMarginOffset { get { return m_ProgressBarMarginOffset; } set { if (m_ProgressBarMarginOffset != value) { m_ProgressBarMarginOffset = value; this.Invalidate(); } } } [Category("Custom")] [Description("Set/Get progress bar background color.")] [DefaultValue(typeof(Color), "White")] public new Color BackColor { get { return base.BackColor; } set { if (base.BackColor != value) { base.BackColor = value; this.Invalidate(); } } } [Category("Custom")] [Description("Set/Get progress bar text color.")] [DefaultValue(typeof(Color), "Blue")] public new Color ForeColor { get { return base.ForeColor; } set { if (base.ForeColor != value) { base.ForeColor = value; this.Invalidate(); } } } [Category("Custom")] [Description("Set/Get progress bar maximum value.")] [DefaultValue(100)] public int Maximum { get { return m_Maximum; } set { if (m_Maximum != value) { if (value < 1) { m_Maximum = 1; } else { m_Maximum = value; } if (m_Maximum < m_Value) { m_Value = m_Maximum; } this.Invalidate(); } } } [Category("Custom")] [Description("Set/Get progress bar current value.")] [DefaultValue(0)] public int Value { get { return m_Value; } set { if (value < 0) { value = 0; } else if (value > m_Maximum) { m_Value = m_Maximum; } else { m_Value = value; } this.Invalidate(); this.Update(); } } #endregion #region disable base properties [DesignerSerializationVisibility(DesignerSerializationVisibility.Hidden)] [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new bool AutoSize { get { return base.AutoSize; } } [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new bool AutoEllipsis { get { return base.AutoEllipsis; } } [DesignerSerializationVisibility(DesignerSerializationVisibility.Hidden)] [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new System.Drawing.ContentAlignment TextAlign { get { return base.TextAlign; } } [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new bool CausesValidation { get { return base.CausesValidation; } } [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new bool AllowDrop { get { return base.AllowDrop; } } [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new Padding Padding { get { return base.Padding; } } [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new ImeMode ImeMode { get { return base.ImeMode; } } [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new bool TabStop { get { return base.TabStop; } } [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new bool UseCompatibleTextRendering { get { return base.UseCompatibleTextRendering; } } [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new bool UseMnemonic { get { return base.UseMnemonic; } } [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new BorderStyle BorderStyle { get { return base.BorderStyle; } } [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new FlatStyle FlatStyle { get { return base.FlatStyle; } } [DesignerSerializationVisibility(DesignerSerializationVisibility.Hidden)] [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new Image Image { get { return base.Image; } } [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new System.Drawing.ContentAlignment ImageAlign { get { return base.ImageAlign; } } [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new int ImageIndex { get { return base.ImageIndex; } } [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new string ImageKey { get { return base.ImageKey; } } [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new ImageList ImageList { get { return base.ImageList; } } [DesignerSerializationVisibility(DesignerSerializationVisibility.Hidden)] [Browsable(false), EditorBrowsable(EditorBrowsableState.Never)] public new string Text { get { return base.Text; } } #endregion /// <summary> /// 重新绘制Lable的文本值为进度值 /// </summary> /// <param name="e"></param> protected override void OnPaint(PaintEventArgs e) { this.DrawPrgressBarBorder(e.Graphics); this.DrawProgressBar(e.Graphics); if (m_ShowProgressBarPercent) { base.Text = ((double)m_Value / (double)m_Maximum).ToString("##0 %"); } else { base.Text = string.Empty; } base.OnPaint(e); } private int GetTopOffSet() { if (!m_ProgressBarMarginOffset) // use no margin { if (m_ProgressBarBorderStyle == TProgressBarBorderStyle.Sunken || m_ProgressBarBorderStyle == TProgressBarBorderStyle.Flat) { return 2; } else if (m_ProgressBarBorderStyle == TProgressBarBorderStyle.None) { return 0; } return 1; } else // use margin { if (m_ProgressBarBorderStyle == TProgressBarBorderStyle.Flat || m_ProgressBarBorderStyle == TProgressBarBorderStyle.Sunken) { return 3; } else if (m_ProgressBarBorderStyle == TProgressBarBorderStyle.None) { return 1; } else { return 2; } } } private int GetLeftOffSet() { if (!m_ProgressBarMarginOffset) { if (m_ProgressBarBorderStyle == TProgressBarBorderStyle.Flat) { return 2; } else if (m_ProgressBarBorderStyle == TProgressBarBorderStyle.None) { return 0; } return 1; } else { if (m_ProgressBarBorderStyle == TProgressBarBorderStyle.Flat || m_ProgressBarBorderStyle == TProgressBarBorderStyle.Sunken) { return 3; } else if (m_ProgressBarBorderStyle == TProgressBarBorderStyle.None) { return 1; } return 2; } } private void DrawProgressBar(Graphics g) { decimal percent = (decimal)m_Value / (decimal)m_Maximum; // width corresponds to Value int valueWidth = (int)((this.ClientRectangle.Width - this.GetLeftOffSet() * 2) * percent); // bar width + space width int oneBlockWidth = m_ProgressBarBlockWidth + m_ProgressBarBlockSpace; // width corresponds to real blocks int blockWidth = (valueWidth / oneBlockWidth) * (oneBlockWidth); if (percent > 0.99m) // add block length to avoid trunc error { if (this.ClientRectangle.Width - this.GetLeftOffSet() * 2 - blockWidth > 0) { blockWidth += (this.ClientRectangle.Width - this.GetLeftOffSet() * 2 - blockWidth) / (oneBlockWidth); } } int left = this.ClientRectangle.Left + this.GetLeftOffSet(); int top = this.ClientRectangle.Top + this.GetTopOffSet(); int height = this.ClientRectangle.Height - this.GetTopOffSet() * 2; int drawnBlockWidth = oneBlockWidth; while (drawnBlockWidth <= blockWidth) { g.FillRectangle(m_ProgressBarFillBrush, left, top, m_ProgressBarBlockWidth, height); left += oneBlockWidth; drawnBlockWidth += oneBlockWidth; } // below code used to draw the tail part. int tailBarWidth = this.ClientRectangle.Width - left - this.GetLeftOffSet(); if (tailBarWidth > 0 && tailBarWidth < oneBlockWidth) // tail is not a full bar { drawnBlockWidth = this.ClientRectangle.Width - left - this.GetLeftOffSet(); if (drawnBlockWidth > 0) { g.FillRectangle(m_ProgressBarFillBrush, left, top, drawnBlockWidth, height); // draw partial bar } } } private void DrawPrgressBarBorder(Graphics g) { if (this.m_ProgressBarBorderStyle == TProgressBarBorderStyle.Single) { ControlPaint.DrawBorder(g, this.ClientRectangle, Color.Black, ButtonBorderStyle.Solid); } else if (this.m_ProgressBarBorderStyle == TProgressBarBorderStyle.Flat) { ControlPaint.DrawBorder3D(g, this.ClientRectangle, Border3DStyle.Flat); } else if (this.m_ProgressBarBorderStyle == TProgressBarBorderStyle.Sunken) { ControlPaint.DrawBorder3D(g, this.ClientRectangle, Border3DStyle.Sunken); } else if (this.m_ProgressBarBorderStyle == TProgressBarBorderStyle.SunkenInner) { ControlPaint.DrawBorder3D(g, this.ClientRectangle, Border3DStyle.SunkenInner); } else if (this.m_ProgressBarBorderStyle == TProgressBarBorderStyle.SunkenOut) { ControlPaint.DrawBorder3D(g, this.ClientRectangle, Border3DStyle.SunkenOuter); } } }

边框样式枚举类：

/// <summary> /// border kind /// </summary> public enum TProgressBarBorderStyle { /// <summary> /// 没有三维效果 /// </summary> Flat, /// <summary> /// 具有凹下的外边缘，无内边缘 /// </summary> SunkenOut, /// <summary> /// 具有凹下的内边缘，无外边缘 /// </summary> SunkenInner, /// <summary> /// 具有凹下的内外边缘 /// </summary> Sunken, /// <summary> /// 实线边缘 /// </summary> Single, /// <summary> /// 无任何样式 /// </summary> None }

 

以上两个对象均在命名空间TS下；用到的其它命名空间如下：

 using System; using System.Collections.Generic; using System.ComponentModel; using System.Diagnostics; using System.Text; using System.Windows.Forms; using System.Drawing;

 

在TSProgressBar的设计文件（TSProgressBar.Designer.cs）中的覆盖Dispose方法中，加入对画刷的清理代码。

namespace TS { partial class TSProgressBar { /// <summary> /// 必需的设计器变量。 /// </summary> private System.ComponentModel.IContainer components = null; /// <summary> /// 清理所有正在使用的资源。 /// </summary> /// <param name="disposing">如果应释放托管资源，为 true；否则为 false。</param> protected override void Dispose(bool disposing) { if (disposing && (components != null)) { components.Dispose(); } m_ProgressBarFillBrush.Dispose(); // release unmanaged resource base.Dispose(disposing); } #region 组件设计器生成的代码 /// <summary> /// 设计器支持所需的方法 - 不要 /// 使用代码编辑器修改此方法的内容。 /// </summary> private void InitializeComponent() { components = new System.ComponentModel.Container(); } #endregion }

 

 三、编译生成，完毕。

四、测试

1、新建Winform窗体，工具箱里拖出这个TSProgressBar组件到窗体上，再在窗体上加入一个Button、PropertyGrid控件。

2、代码如下：

private void button1_Click(object sender, EventArgs e) { int delay = 20; this.tsProgressBar1.Value = 0; for (int k = 0; k <= 100; k++) { this.tsProgressBar1.Value = k; System.Threading.Thread.Sleep(delay); } } private void Form1_Load(object sender, EventArgs e) { this.propertyGrid1.SelectedObjects = new object[] { tsProgressBar1 }; }