C# 用户控件之温度计

发布时间：2020-12-16 01:13:41 所属栏目：百科来源：网络整理

导读：本文以一个用户控件【User Control】实现温度计的小例子，简述用户控件的相关知识，以供学习分享使用，如有不足之处，还请指正。概述一般而言，用户控件【User Control】，是在Visual Studio提供的默认控件不能满足实际的工作需要，才需要在现有控件的基础

本文以一个用户控件【User Control】实现温度计的小例子，简述用户控件的相关知识，以供学习分享使用，如有不足之处，还请指正。

概述

一般而言，用户控件【User Control】，是在Visual Studio提供的默认控件不能满足实际的工作需要，才需要在现有控件的基础之上进行新的扩展，来实现自己的功能。用户控件有自己特有的属性，事件，方法来支撑特定的功能。用户控件封装实现的细节，可以进行方便的复用。

用户控件分类

用户控件主要有以下三种分类，本例采用的是第三种。

复合控件（Composite Controls）：将现有的各种控件组合起来，形成一个新的控件，来满足用户的需求。
扩展控件（Extended Controls）：就是在现有的控件基础上，派生出一个新的控件，增加新的功能，或者修改原有功能，来满足用户需求。
自定义控件（Custom Controls）：就是直接从UserControl类派生，也就是说完全由自己来设计、实现一个全新的控件，这是最灵活、最强大的方法。

涉及知识点

本例中主要涉及以下知识点：

UserControl ：提供一个可用来创建其他控件的空控件。用户创建一个用户控件，会默认继承这个类。
OnPaint ：控件重绘方法，是protected修饰符，本例中需要重写此方法。
Graphics ：密封类，不可被继承，用于绘制图形（包括矩形，扇形，直线等）。
ToolTip ：表示一个长方形的小弹出窗口，该窗口在用户将指针悬停在一个控件上时显示有关该控件用途的简短说明。
鼠标事件函数：OnMouseHover 鼠标悬停时触发函数，OnMouseLeave鼠标离开时触发函数。
DataGridView：在可自定义的网格中显示数据。

示例效果图

本例中示例效果图如下所示：

关键代码

本例中的关键代码如下：

  1 using System;
  2  System.Collections.Generic;
  3  System.ComponentModel;
  4  System.Drawing;
  5  System.Data;
  6  System.Linq;
  7  System.Text;
  8  System.Threading.Tasks;
  9  System.Windows.Forms;
 10 
 11 namespace DemoThermometer
 12 {
 13     public partial class Thermometer : UserControl
 14     {
 15         #region 属性与构造函数
 16 
 17         private int interval = 10;
 18 
 19         /// <summary>
 20         /// 刻度间隔
 21         </summary>
 22         int Interval
 23         {
 24             get { return interval; }
 25 
 26             set { interval = value; }
 27         }
 28 
 29         int minValue = -50 30 
 31          32          最低温度
 33          34          MinValue
 35  36              minValue; }
 37 
 38             set { minValue = 39  40 
 41         int maxValue =  42 
 43          44          最高温度
 45          46          MaxValue
 47  48              maxValue; }
 49 
 50             set { maxValue = 51  52 
 53         float curValue = 0 54 
 55          56          当前温度
 57          58         float CurValue
 59  60              curValue; }
 61 
 62             set { curValue = 63  64 
 65         private Color thermoColor = Color.Red;
 66 
 67          68          温度条颜色
 69          70         public Color ThermoColor
 71  72              thermoColor; }
 73 
 74             set { thermoColor = 75  76 
 77         private Color backGroundColor = Color.SkyBlue;
 78 
 79          80          温度计背景色
 81          82          Color BackGroundColor
 83  84              backGroundColor; }
 85 
 86             set { backGroundColor = 87  88 
 89         private Font thermoFont=new Font("宋体",,FontStyle.Regular);
 90 
 91          92          温度计上字体
 93          94          Font ThermoFont
 95  96              thermoFont; }
 97 
 98             set { thermoFont = 99 100 
101         string thermoTitle = 温度计"102 
103         104          标题
105         106         string ThermoTitle
107 108             return this.thermoTitle; }
109             set { this.thermoTitle =110 111 
112         bool showTip = false113 
114         115          是否显示提示
116         117         bool ShowTip
118 119              showTip; }
120 
121             set { showTip =122 123 
124         private ToolTip tip=new ToolTip();
125 
126          Thermometer()
127 128             InitializeComponent();
129 130 
131         #endregion
132 
133         protected override void OnPaint(PaintEventArgs e)
134 135             
136             //base.OnPaint(e);
137             this.BackColor = this.backGroundColor;
138             int width = .Width;
139             int height = this.Height -  ;
140             Graphics g = e.Graphics;
141             int c_x = width / 2142             int c_y = height / 143             int padding = this.Padding.All;空白
144             int r = (width - 2 * padding)/2;半径
145             int d = 2 * r;直径
146             int dis = 两个半圆之间的间隔
147             int dis2 = 2 * dis;填充与边框之间的距离
148             int startAngle1 = -180149             int startAngle2 = 150             int sweepAngle1 = 151             首先画顶端一个半圆
152             g.DrawPie(Pens.Black, Rectangle(padding,padding,d,d),startAngle1,sweepAngle1);
153             g.DrawPie(Pens.Black,1)">new Rectangle(padding+ dis,padding+ dis,d-2* dis,1)">2* dis),1)">154             填充背景色
155             g.FillPie(new SolidBrush(this.backGroundColor),1)">new Rectangle(padding + dis2,padding + dis2,d - 2*dis2,1)">dis2),1)">156             画底端一个半圆
157             g.DrawPie(Pens.Black,1)">new Rectangle(padding,height-d-padding,startAngle2,1)">158             g.DrawPie(Pens.Black,1)">new Rectangle(padding + dis,height-d-padding + dis,1)">2*dis,1)">dis),1)">159             g.FillPie(160             画一个矩形
161             g.DrawRectangle(Pens.Black,padding + r,height - d - 2 * padding));
162             g.DrawRectangle(Pens.Black,1)">new Rectangle(padding+dis,padding + r+dis,1)">2 * padding-dis));
163             背景色填充，去掉边界线
164             g.FillRectangle(new Rectangle(padding+3,padding + r-2,1)">2 * r-6,1)">6));
165             g.FillRectangle(new Rectangle(padding + 4,1)">2 * r - 8166             背景色填充中间部分
167             g.FillRectangle(2 * padding - dis2));
168             画刻度
169             int s_s_x_1 = padding + r - 20170             int s_s_x_2 = width-padding - r + 171             int s_s_y = padding + r+4172             int total = this.maxValue - .minValue;
173             int scale_width = 5;刻度宽度
174             int scale = total / .interval;
175             int pscale = (height - 2 * padding) / this.interval;像素间隔
176                                                                         
177             竖线
178             g.DrawLine(Pens.Black,1)">new Point(s_s_x_1,s_s_y ),s_s_y + this.interval* pscale));
179             g.DrawLine(Pens.Black,1)">new Point(s_s_x_2,s_s_y),1)">this.interval *180             for (int i = 0; i <= this.interval; i++) {
181                 横线刻度
182                 g.DrawLine(Pens.Black,1)">new Point(s_s_x_1- scale_width,s_s_y + i * pscale),s_s_y + i *183                 g.DrawLine(Pens.Black,1)">new Point(s_s_x_2 + scale_width,1)">184                 画刻度数字
185 
186                 g.DrawString((this.maxValue - (scale * i)).ToString(),1)">this.thermoFont,1)">new SolidBrush( this.ForeColor),1)">new Point(s_s_x_1-35,s_s_y + i * pscale-187                 g.DrawString((new Point(s_s_x_2 + 10,1)">188             }
189             int white_width = 3;中间白色线宽度
190             画条白色细线
191             g.FillRectangle(Brushes.White,1)">new Rectangle(c_x- white_width,r/r));
192             在底部画一个圆球
193             g.FillPie(this.thermoColor),1)">new Rectangle(c_x-r/2+5,height -  r - padding,r-10),1)">0,1)">360);
194             根据当前温度画红色线
195             int red_width = 红色温度线宽度
196             float ii = ( this.curValue-this.minValue) / 197             g.FillRectangle(new RectangleF(c_x - red_width,height - r - padding- (ii * pscale)-2* red_width,ii * pscale+5));此处有一像素的误差
198             画标志字符单℃位
199             g.DrawString(℃new Point(c_x - 30,r / 2 - 200             Font titleFont = 13201             绘制标题
202             SizeF tsize = g.MeasureString(.thermoTitle,titleFont);
203             g.DrawString(this.thermoTitle,titleFont,1)">new PointF(c_x- (tsize.Width/2),height + 5204             string cur = string.Format(当前温度：{0}℃.curValue);
205             SizeF tsize2 = g.MeasureString(cur,1)">.thermoFont);
206             g.DrawString(cur,1)">new PointF(c_x - (tsize2.Width / 10+tsize.Height));
207 208 
209         210          当鼠标覆盖进去时
211         212         <param name="e"></param>
213          OnMouseHover(EventArgs e)
214 215             this.showTip = true216             需要显示的内容
217             int x = this.Width / 218             int y = (this.Height-50) / 219             StringBuilder sbTips =  StringBuilder();
220             sbTips.AppendLine(this.ThermoTitle);
221             sbTips.AppendLine(当前温度：{0}.curValue));
222             sbTips.AppendLine(单位：℃223             tip.ToolTipTitle = .ThermoTitle;
224             tip.IsBalloon = 225             tip.UseFading = 226             t.SetToolTip(this,sbTips.ToString());
227             tip.Show(sbTips.ToString(),x,y);
228 229         
230 
231          OnMouseLeave(EventArgs e)
232 233             234             tip.Hide(235 236     }
237 }

View Code

关于页面调用控件刷新代码如下：

 1 void dgDetail_SelectionChanged(object sender,EventArgs e)
 2  3             foreach (DataGridViewRow row in .dgDetail.Rows)
 4             {
 5                 if (row.Selected)
 6                 { 
 7                     DataRowView drv = row.DataBoundItem as DataRowView;
 8                     DataRow dr = drv.Row;
 9                     this.t1.CurValue = int.Parse(dr[Morning].ToString());
10                     this.t1.ThermoTitle = {0}温度colMorning].HeaderText);
11                     .t1.Refresh();
12                     this.t2.CurValue = Middle13                     this.t2.ThermoTitle = colMiddle14                     .t2.Refresh();
15                     this.t3.CurValue = After16                     this.t3.ThermoTitle = colAfter17                     .t3.Refresh();
18                     this.t4.CurValue = Night19                     this.t4.ThermoTitle = colNight20                     .t4.Refresh();
21                 }
22 23         }

View Code

圆角Panel

关于要实现圆角Panel【扩展控件】，需要以下几个步骤

定义一个用户控件，继承于Panel，主要是为了继承Panel的其他容器特性。
重写Panel的OnPaint方法，进行绘制四个圆角。

圆角Panel效果图如下：

圆角Panel核心代码如下

 3  5  7  8  9 10 
11 12 13      UPanelControl : Panel
14 15         int radius = 15;弧度半径
16 
17          Radius
18 19              radius; }
20 
21             set { radius =23 
24         private Color borderColor =25 
26          Color BorderColor
27 28              borderColor; }
29             set { borderColor =30 31 
32          UPanelControl()
33 34 35 36 
37         38 39             base.OnPaint(e);
40             Graphics g =41             42             .Height;
43              radius;
44             int p = 1;偏移量
45             Pen borderPen = new Pen(borderColor,1)">146             Brush brush= .BackColor);
47             左上
48             g.DrawPie(borderPen,1)">new Rectangle(180,1)">9049             g.FillPie(brush,1)">new Rectangle(p,p,1)">50 
51             左下
52             g.DrawPie(borderPen,height-d,1)">90,1)">53             g.FillPie(brush,height-d-p,d ),1)">54             右上
55             g.DrawPie(borderPen,1)">new Rectangle(width-d,1)">270,1)">56             g.FillPie(brush,1)">new Rectangle(width-d-p,1)">57             右下
58             g.DrawPie(borderPen,1)">new Rectangle(width - d,height - d,1)">59             g.FillPie(brush,1)">new Rectangle(width - d - p,1)">60             左边竖线
61             g.DrawLine(borderPen,radius,height - radius);
62 
63             上边竖线
64             g.DrawLine(borderPen,width-radius,1)">65 
66             右边竖线
67             g.DrawLine(borderPen,width-1,radius-368 
69             下边竖线
70             g.DrawLine(borderPen,height-71 72 73 }

View Code

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!