当前位置： 移动技术网 > IT编程>开发语言>.net > （四十一）c#Winform自定义控件-进度条

（四十一）c#Winform自定义控件-进度条

2019年08月20日  | 移动技术网IT编程  | 我要评论

凤凰传奇快乐大本营,天涯社区重庆论坛,2013036

前提

入行已经7,8年了，一直想做一套漂亮点的自定义控件，于是就有了本系列文章。

开源地址：

如果觉得写的还行，请点个 star 支持一下吧

欢迎前来交流探讨： 企鹅群568015492 

nuget

install-package hzh_controls

目录

准备工作

前面写过一个进度条，但是并不是太好，这次用gdi+再重绘一个，不了解gdi+的自行百度了解下先

（七）c#winform自定义控件-进度条

开始

添加一个类，命名ucprocessline，继承control

添加一个枚举，用以如何显示值

 1  public enum valuetexttype
 2     {
 3         none,
 4         /// <summary>
 5         /// 百分比
 6         /// </summary>
 7         percent,
 8         /// <summary>
 9         /// 数值
10         /// </summary>
11         absolute
12     }

 

添加一些属性

  1 [description("值变更事件"), category("自定义")]
  2         public event eventhandler valuechanged;
  3         int m_value = 0;
  4         [description("当前属性"), category("自定义")]
  5         public int value
  6         {
  7             set
  8             {
  9                 if (value > m_maxvalue)
 10                     m_value = m_maxvalue;
 11                 else if (value < 0)
 12                     m_value = 0;
 13                 else
 14                     m_value = value;
 15                 if (valuechanged != null)
 16                     valuechanged(this, null);
 17                 refresh();
 18             }
 19             get
 20             {
 21                 return m_value;
 22             }
 23         }
 24 
 25         private int m_maxvalue = 100;
 26 
 27         [description("最大值"), category("自定义")]
 28         public int maxvalue
 29         {
 30             get { return m_maxvalue; }
 31             set
 32             {
 33                 if (value < m_value)
 34                     m_maxvalue = m_value;
 35                 else
 36                     m_maxvalue = value;
 37                 refresh();
 38             }
 39         }
 40 
 41         color m_valuecolor = color.fromargb(73, 119, 232);
 42 
 43         [description("值进度条颜色"), category("自定义")]
 44         public color valuecolor
 45         {
 46             get { return m_valuecolor; }
 47             set
 48             {
 49                 m_valuecolor = value;
 50                 refresh();
 51             }
 52         }
 53 
 54         private color m_valuebgcolor = color.white;
 55 
 56         [description("值背景色"), category("自定义")]
 57         public color valuebgcolor
 58         {
 59             get { return m_valuebgcolor; }
 60             set
 61             {
 62                 m_valuebgcolor = value;
 63                 refresh();
 64             }
 65         }
 66 
 67         private color m_bordercolor = color.fromargb(192, 192, 192);
 68 
 69         [description("边框颜色"), category("自定义")]
 70         public color bordercolor
 71         {
 72             get { return m_bordercolor; }
 73             set
 74             {
 75                 m_bordercolor = value;
 76                 refresh();
 77             }
 78         }
 79 
 80         [description("值字体"), category("自定义")]
 81         public override font font
 82         {
 83             get
 84             {
 85                 return base.font;
 86             }
 87             set
 88             {
 89                 base.font = value;
 90                 refresh();
 91             }
 92         }
 93 
 94         [description("值字体颜色"), category("自定义")]
 95         public override system.drawing.color forecolor
 96         {
 97             get
 98             {
 99                 return base.forecolor;
100             }
101             set
102             {
103                 base.forecolor = value;
104                 refresh();
105             }
106         }
107         private valuetexttype m_valuetexttype = valuetexttype.percent;
108 
109         [description("值显示样式"), category("自定义")]
110         public valuetexttype valuetexttype
111         {
112             get { return m_valuetexttype; }
113             set
114             {
115                 m_valuetexttype = value;
116                 refresh();
117             }
118         }

重绘

 1  protected override void onpaint(painteventargs e)
 2         {
 3             console.writeline(datetime.now);
 4             base.onpaint(e);
 5             graphics g = e.graphics;
 6             g.setgdihigh();
 7 
 8             brush sb = new solidbrush(m_valuebgcolor);
 9             g.fillrectangle(sb, new rectangle(base.clientrectangle.x, base.clientrectangle.y, base.clientrectangle.width - 3, base.clientrectangle.height - 2));
10             graphicspath path1 = controlhelper.createroundedrectanglepath(new rectangle(base.clientrectangle.x, base.clientrectangle.y + 1, base.clientrectangle.width - 3, base.clientrectangle.height - 4), 3);
11             g.drawpath(new pen(m_bordercolor, 1), path1);
12             lineargradientbrush lgb = new lineargradientbrush(new point(0, 0), new point(0, base.clientrectangle.height - 3), m_valuecolor, color.fromargb(200, m_valuecolor.r, m_valuecolor.g, m_valuecolor.b));
13             g.fillpath(lgb, controlhelper.createroundedrectanglepath(new rectangle(0, (base.clientrectangle.height - (base.clientrectangle.height - 3)) / 2, (base.clientrectangle.width - 3) * value / m_maxvalue, base.clientrectangle.height - 4), 3));
14             string strvalue = string.empty;
15             if (m_valuetexttype == hzh_controls.controls.valuetexttype.percent)
16                 strvalue = ((float)value / (float)m_maxvalue).tostring("0%");
17             else if (m_valuetexttype == hzh_controls.controls.valuetexttype.absolute)
18                 strvalue = value + "/" + m_maxvalue;
19             if (!string.isnullorempty(strvalue))
20             {
21                 system.drawing.sizef sizef = g.measurestring(strvalue, font);
22                 g.drawstring(strvalue, font, new solidbrush(forecolor), new pointf((this.width - sizef.width) / 2, (this.height - sizef.height) / 2 + 1));
23             }
24         }

完整代码来一份

  1 using system;
  2 using system.collections.generic;
  3 using system.componentmodel;
  4 using system.drawing;
  5 using system.data;
  6 using system.linq;
  7 using system.text;
  8 using system.windows.forms;
  9 using system.drawing.drawing2d;
 10 
 11 namespace hzh_controls.controls
 12 {
 13     public class ucprocessline : control
 14     {
 15         [description("值变更事件"), category("自定义")]
 16         public event eventhandler valuechanged;
 17         int m_value = 0;
 18         [description("当前属性"), category("自定义")]
 19         public int value
 20         {
 21             set
 22             {
 23                 if (value > m_maxvalue)
 24                     m_value = m_maxvalue;
 25                 else if (value < 0)
 26                     m_value = 0;
 27                 else
 28                     m_value = value;
 29                 if (valuechanged != null)
 30                     valuechanged(this, null);
 31                 refresh();
 32             }
 33             get
 34             {
 35                 return m_value;
 36             }
 37         }
 38 
 39         private int m_maxvalue = 100;
 40 
 41         [description("最大值"), category("自定义")]
 42         public int maxvalue
 43         {
 44             get { return m_maxvalue; }
 45             set
 46             {
 47                 if (value < m_value)
 48                     m_maxvalue = m_value;
 49                 else
 50                     m_maxvalue = value;
 51                 refresh();
 52             }
 53         }
 54 
 55         color m_valuecolor = color.fromargb(73, 119, 232);
 56 
 57         [description("值进度条颜色"), category("自定义")]
 58         public color valuecolor
 59         {
 60             get { return m_valuecolor; }
 61             set
 62             {
 63                 m_valuecolor = value;
 64                 refresh();
 65             }
 66         }
 67 
 68         private color m_valuebgcolor = color.white;
 69 
 70         [description("值背景色"), category("自定义")]
 71         public color valuebgcolor
 72         {
 73             get { return m_valuebgcolor; }
 74             set
 75             {
 76                 m_valuebgcolor = value;
 77                 refresh();
 78             }
 79         }
 80 
 81         private color m_bordercolor = color.fromargb(192, 192, 192);
 82 
 83         [description("边框颜色"), category("自定义")]
 84         public color bordercolor
 85         {
 86             get { return m_bordercolor; }
 87             set
 88             {
 89                 m_bordercolor = value;
 90                 refresh();
 91             }
 92         }
 93 
 94         [description("值字体"), category("自定义")]
 95         public override font font
 96         {
 97             get
 98             {
 99                 return base.font;
100             }
101             set
102             {
103                 base.font = value;
104                 refresh();
105             }
106         }
107 
108         [description("值字体颜色"), category("自定义")]
109         public override system.drawing.color forecolor
110         {
111             get
112             {
113                 return base.forecolor;
114             }
115             set
116             {
117                 base.forecolor = value;
118                 refresh();
119             }
120         }
121         private valuetexttype m_valuetexttype = valuetexttype.percent;
122 
123         [description("值显示样式"), category("自定义")]
124         public valuetexttype valuetexttype
125         {
126             get { return m_valuetexttype; }
127             set
128             {
129                 m_valuetexttype = value;
130                 refresh();
131             }
132         }
133         public ucprocessline()
134         {
135             size = new size(200, 15);
136             forecolor = color.fromargb(255, 77, 59);
137             font = new font("arial unicode ms", 10);
138             this.setstyle(controlstyles.allpaintinginwmpaint, true);
139             this.setstyle(controlstyles.doublebuffer, true);
140             this.setstyle(controlstyles.resizeredraw, true);
141             this.setstyle(controlstyles.selectable, true);
142             this.setstyle(controlstyles.supportstransparentbackcolor, true);
143             this.setstyle(controlstyles.userpaint, true);
144         }
145 
146         protected override void onpaint(painteventargs e)
147         {
148             console.writeline(datetime.now);
149             base.onpaint(e);
150             graphics g = e.graphics;
151             g.setgdihigh();
152 
153             brush sb = new solidbrush(m_valuebgcolor);
154             g.fillrectangle(sb, new rectangle(base.clientrectangle.x, base.clientrectangle.y, base.clientrectangle.width - 3, base.clientrectangle.height - 2));
155             graphicspath path1 = controlhelper.createroundedrectanglepath(new rectangle(base.clientrectangle.x, base.clientrectangle.y + 1, base.clientrectangle.width - 3, base.clientrectangle.height - 4), 3);
156             g.drawpath(new pen(m_bordercolor, 1), path1);
157             lineargradientbrush lgb = new lineargradientbrush(new point(0, 0), new point(0, base.clientrectangle.height - 3), m_valuecolor, color.fromargb(200, m_valuecolor.r, m_valuecolor.g, m_valuecolor.b));
158             g.fillpath(lgb, controlhelper.createroundedrectanglepath(new rectangle(0, (base.clientrectangle.height - (base.clientrectangle.height - 3)) / 2, (base.clientrectangle.width - 3) * value / m_maxvalue, base.clientrectangle.height - 4), 3));
159             string strvalue = string.empty;
160             if (m_valuetexttype == hzh_controls.controls.valuetexttype.percent)
161                 strvalue = ((float)value / (float)m_maxvalue).tostring("0%");
162             else if (m_valuetexttype == hzh_controls.controls.valuetexttype.absolute)
163                 strvalue = value + "/" + m_maxvalue;
164             if (!string.isnullorempty(strvalue))
165             {
166                 system.drawing.sizef sizef = g.measurestring(strvalue, font);
167                 g.drawstring(strvalue, font, new solidbrush(forecolor), new pointf((this.width - sizef.width) / 2, (this.height - sizef.height) / 2 + 1));
168             }
169         }
170 
171     }
172 
173     public enum valuetexttype
174     {
175         none,
176         /// <summary>
177         /// 百分比
178         /// </summary>
179         percent,
180         /// <summary>
181         /// 数值
182         /// </summary>
183         absolute
184     }
185 }

 

用处及效果

最后的话

如果你喜欢的话，请到  点个星 星吧

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！ 点击进行留言回复

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网