欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

(五十)c#Winform自定义控件-滑块

程序员文章站 2022-07-02 13:14:07
前提 入行已经7,8年了,一直想做一套漂亮点的自定义控件,于是就有了本系列文章。 GitHub:https://github.com/kwwwvagaa/NetWinformControl 码云:https://gitee.com/kwwwvagaa/net_winform_custom_contr ......

前提

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

github:https://github.com/kwwwvagaa/netwinformcontrol

码云:

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

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

麻烦博客下方点个【推荐】,谢谢

nuget

install-package hzh_controls

目录

用处及效果

(五十)c#Winform自定义控件-滑块

准备工作

依然是gdi+画的,不了解自行百度学习下

开始

添加一个类uctrackbar,继承control

添加属性

 1  [description("值改变事件"), category("自定义")]
 2         public event eventhandler valuechanged;
 3 
 4         private int dcimaldigits = 0;
 5 
 6         [description("值小数精确位数"), category("自定义")]
 7         public int dcimaldigits
 8         {
 9             get { return dcimaldigits; }
10             set { dcimaldigits = value; }
11         }
12 
13         private float linewidth = 10;
14 
15         [description("线宽度"), category("自定义")]
16         public float linewidth
17         {
18             get { return linewidth; }
19             set { linewidth = value; }
20         }
21 
22         private float minvalue = 0;
23 
24         [description("最小值"), category("自定义")]
25         public float minvalue
26         {
27             get { return minvalue; }
28             set
29             {
30                 if (minvalue > m_value)
31                     return;
32                 minvalue = value;
33                 this.refresh();
34             }
35         }
36 
37         private float maxvalue = 100;
38 
39         [description("最大值"), category("自定义")]
40         public float maxvalue
41         {
42             get { return maxvalue; }
43             set
44             {
45                 if (value < m_value)
46                     return;
47                 maxvalue = value;
48                 this.refresh();
49             }
50         }
51 
52         private float m_value = 0;
53 
54         [description("值"), category("自定义")]
55         public float value
56         {
57             get { return this.m_value; }
58             set
59             {
60                 if (value > maxvalue || value < minvalue)
61                     return;
62                 var v = (float)math.round((double)value, dcimaldigits);
63                 if (value == v)
64                     return;
65                 this.m_value = v;
66                 this.refresh();
67                 if (valuechanged != null)
68                 {
69                     valuechanged(this, null);
70                 }
71             }
72         }
73 
74         private color m_linecolor = color.fromargb(255, 77, 59);
75 
76         [description("线颜色"), category("自定义")]
77         public color linecolor
78         {
79             get { return m_linecolor; }
80             set
81             {
82                 m_linecolor = value;
83                 this.refresh();
84             }
85         }
86         rectanglef m_linerectangle;
87         rectanglef m_trackrectangle;

重绘

 1  protected override void onpaint(painteventargs e)
 2         {
 3             base.onpaint(e);
 4             graphics g = e.graphics;
 5             g.setgdihigh();
 6             m_linerectangle = new rectanglef(linewidth, (this.size.height - linewidth) / 2, this.size.width - linewidth * 2, linewidth);
 7             graphicspath pathline = controlhelper.createroundedrectanglepath(m_linerectangle, 5);
 8             g.fillpath(new solidbrush(m_linecolor), pathline);
 9             m_trackrectangle = new rectanglef(m_linerectangle.left - linewidth + (((float)m_value / (float)(maxvalue - minvalue)) * (this.size.width - linewidth * 2)), (this.size.height - linewidth * 2) / 2, linewidth * 2, linewidth * 2);
10             g.fillellipse(new solidbrush(m_linecolor), m_trackrectangle);
11             g.fillellipse(brushes.white, new rectanglef(m_trackrectangle.x + m_trackrectangle.width / 4, m_trackrectangle.y + m_trackrectangle.height / 4, m_trackrectangle.width / 2, m_trackrectangle.height / 2));
12         }

处理拖动

 1  public uctrackbar()
 2         {
 3             this.size = new size(250, 30);
 4             this.setstyle(controlstyles.allpaintinginwmpaint, true);
 5             this.setstyle(controlstyles.doublebuffer, true);
 6             this.setstyle(controlstyles.resizeredraw, true);
 7             this.setstyle(controlstyles.selectable, true);
 8             this.setstyle(controlstyles.supportstransparentbackcolor, true);
 9             this.setstyle(controlstyles.userpaint, true);
10             this.mousedown += uctrackbar_mousedown;
11             this.mousemove += uctrackbar_mousemove;
12             this.mouseup += uctrackbar_mouseup;
13         }
14 
15         bool blndown = false;
16         void uctrackbar_mousedown(object sender, mouseeventargs e)
17         {
18             if (m_linerectangle.contains(e.location) || m_trackrectangle.contains(e.location))
19             {
20                 blndown = true;
21                 value = ((float)e.location.x / (float)this.width) * (maxvalue - minvalue);
22             }
23         }
24         void uctrackbar_mousemove(object sender, mouseeventargs e)
25         {
26             if (blndown)
27             {
28                 value = ((float)e.location.x / (float)this.width) * (maxvalue - minvalue);
29             }
30         }
31         void uctrackbar_mouseup(object sender, mouseeventargs e)
32         {
33             blndown = false;
34         }

完整代码

  1 using system;
  2 using system.collections.generic;
  3 using system.linq;
  4 using system.text;
  5 using system.windows.forms;
  6 using system.drawing;
  7 using system.drawing.drawing2d;
  8 using system.componentmodel;
  9 
 10 namespace hzh_controls.controls
 11 {
 12     public class uctrackbar : control
 13     {
 14         [description("值改变事件"), category("自定义")]
 15         public event eventhandler valuechanged;
 16 
 17         private int dcimaldigits = 0;
 18 
 19         [description("值小数精确位数"), category("自定义")]
 20         public int dcimaldigits
 21         {
 22             get { return dcimaldigits; }
 23             set { dcimaldigits = value; }
 24         }
 25 
 26         private float linewidth = 10;
 27 
 28         [description("线宽度"), category("自定义")]
 29         public float linewidth
 30         {
 31             get { return linewidth; }
 32             set { linewidth = value; }
 33         }
 34 
 35         private float minvalue = 0;
 36 
 37         [description("最小值"), category("自定义")]
 38         public float minvalue
 39         {
 40             get { return minvalue; }
 41             set
 42             {
 43                 if (minvalue > m_value)
 44                     return;
 45                 minvalue = value;
 46                 this.refresh();
 47             }
 48         }
 49 
 50         private float maxvalue = 100;
 51 
 52         [description("最大值"), category("自定义")]
 53         public float maxvalue
 54         {
 55             get { return maxvalue; }
 56             set
 57             {
 58                 if (value < m_value)
 59                     return;
 60                 maxvalue = value;
 61                 this.refresh();
 62             }
 63         }
 64 
 65         private float m_value = 0;
 66 
 67         [description("值"), category("自定义")]
 68         public float value
 69         {
 70             get { return this.m_value; }
 71             set
 72             {
 73                 if (value > maxvalue || value < minvalue)
 74                     return;
 75                 var v = (float)math.round((double)value, dcimaldigits);
 76                 if (value == v)
 77                     return;
 78                 this.m_value = v;
 79                 this.refresh();
 80                 if (valuechanged != null)
 81                 {
 82                     valuechanged(this, null);
 83                 }
 84             }
 85         }
 86 
 87         private color m_linecolor = color.fromargb(255, 77, 59);
 88 
 89         [description("线颜色"), category("自定义")]
 90         public color linecolor
 91         {
 92             get { return m_linecolor; }
 93             set
 94             {
 95                 m_linecolor = value;
 96                 this.refresh();
 97             }
 98         }
 99         rectanglef m_linerectangle;
100         rectanglef m_trackrectangle;
101 
102         public uctrackbar()
103         {
104             this.size = new size(250, 30);
105             this.setstyle(controlstyles.allpaintinginwmpaint, true);
106             this.setstyle(controlstyles.doublebuffer, true);
107             this.setstyle(controlstyles.resizeredraw, true);
108             this.setstyle(controlstyles.selectable, true);
109             this.setstyle(controlstyles.supportstransparentbackcolor, true);
110             this.setstyle(controlstyles.userpaint, true);
111             this.mousedown += uctrackbar_mousedown;
112             this.mousemove += uctrackbar_mousemove;
113             this.mouseup += uctrackbar_mouseup;
114         }
115 
116         bool blndown = false;
117         void uctrackbar_mousedown(object sender, mouseeventargs e)
118         {
119             if (m_linerectangle.contains(e.location) || m_trackrectangle.contains(e.location))
120             {
121                 blndown = true;
122                 value = ((float)e.location.x / (float)this.width) * (maxvalue - minvalue);
123             }
124         }
125         void uctrackbar_mousemove(object sender, mouseeventargs e)
126         {
127             if (blndown)
128             {
129                 value = ((float)e.location.x / (float)this.width) * (maxvalue - minvalue);
130             }
131         }
132         void uctrackbar_mouseup(object sender, mouseeventargs e)
133         {
134             blndown = false;
135         }
136 
137 
138         protected override void onpaint(painteventargs e)
139         {
140             base.onpaint(e);
141             graphics g = e.graphics;
142             g.setgdihigh();
143             m_linerectangle = new rectanglef(linewidth, (this.size.height - linewidth) / 2, this.size.width - linewidth * 2, linewidth);
144             graphicspath pathline = controlhelper.createroundedrectanglepath(m_linerectangle, 5);
145             g.fillpath(new solidbrush(m_linecolor), pathline);
146             m_trackrectangle = new rectanglef(m_linerectangle.left - linewidth + (((float)m_value / (float)(maxvalue - minvalue)) * (this.size.width - linewidth * 2)), (this.size.height - linewidth * 2) / 2, linewidth * 2, linewidth * 2);
147             g.fillellipse(new solidbrush(m_linecolor), m_trackrectangle);
148             g.fillellipse(brushes.white, new rectanglef(m_trackrectangle.x + m_trackrectangle.width / 4, m_trackrectangle.y + m_trackrectangle.height / 4, m_trackrectangle.width / 2, m_trackrectangle.height / 2));
149         }
150     }
151 }

 

最后的话

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