WEB状态条控件

<转自炳哥的BLOG>  

近段时间为了工作的需要学习了一下写自定义控件,呵呵!以前没写过,近段时间才开始研究的,昨天写了一个WEB状态条控件,
可以设置进度条的百分比,也可以设置它的总数与当前的数量来自动计算百分比,可以设置颜色显示或图片显示(当没有设置图片
的时候就会自动用颜色来显示),状态条的宽度和高度可以自由设定,还是第一次写控件,希望大家多多指教.好了不多说了,还是把
代码贴出来供大家参考吧!有不同想法的希望大家能提出来交流一下!

先看看运行效果:
           

第一步:
          新建一个类文件Guage.cs
          代码如下:
      

  1using System;
  2using System.Drawing;
  3using System.Web;
  4using System.Web.UI;
  5using System.Web.UI.WebControls;
  6using System.ComponentModel;
  7
  8namespace ZYT.Web.UI
  9{
 10    /**//// <summary>
 11    /// 进度条WEB控件
 12
 13    [DefaultProperty("Text"),
 14    ToolboxData("<{0}:Guage runat=server></{0}:Guage>")]
 15    public class Guage : System.Web.UI.WebControls.WebControl
 16    {
 17        变量#region 变量
 18        /**//// <summary>
 19        /// 列数(单元格)
 20        /// </summary>
 21        private int intCellCount = 20;
 22
 23        /**//// <summary>
 24        /// 设置进度条百分比
 25        /// </summary>
 26        private int intPercentage = 0;
 27
 28        /**//// <summary>
 29        /// 总数量
 30        /// </summary>
 31        private int intMaxNum = 0;
 32        /**//// <summary>
 33        /// 现在数量
 34        /// </summary>
 35        private int intCurNum = 0;
 36
 37        /**//// <summary>
 38        /// 填充图片地址
 39        /// </summary>
 40        private string strFillImageUrl = "";
 41        /**//// <summary>
 42        /// 进度条图片地址
 43        /// </summary>
 44        private string strBarImageUrl = "";
 45
 46        #endregion
 47
 48        属性#region 属性
 49        [Description("进度条百分比步长(必须被100整除)")]
 50        public int PercentageStep
 51        {
 52            get { return 100 / intCellCount; }
 53            set
 54            {
 55                if ((100 % value) != 0)
 56                {
 57                    throw new ArgumentException("百分比步长必须被100整除");
 58                }
 59                intCellCount = 100 / value;
 60            }
 61        }
 62
 63        [Description("设置进度条百分比"), DefaultValue(0)]
 64        public int Percentage
 65        {
 66            get { return intPercentage; }
 67            set
 68            {
 69                // 确定百分比在指定的范围内
 70                //
 71                if (value > 100) // 超过100则显示100
 72                {
 73                    intPercentage = 100;
 74                }
 75                else if (value < 0) // 小于0则显示0
 76                {
 77                    intPercentage = 0;
 78                }
 79                else
 80                {
 81                    intPercentage = value;
 82                }
 83            }
 84        }
 85
 86        [Description("总数量")]
 87        public int MaxNum
 88        {
 89            get { return intMaxNum; }
 90            set
 91            {
 92                intMaxNum = value;
 93            }
 94        }
 95
 96        [Description("当前数量")]
 97        public int CurNum
 98        {
 99            get { return intCurNum; }
100            set
101            {
102                intCurNum = value;
103            }
104        }
105
106        [Description("填充图片地址")]
107        public string FillImageUrl
108        {
109            get { return strFillImageUrl; }
110            set { strFillImageUrl = value; }
111        }
112
113        [Description("进度条图片地址")]
114        public string BarImageUrl
115        {
116            get { return strBarImageUrl; }
117            set { strBarImageUrl = value; }
118        }
119
120        #endregion
121
122        构造函数#region 构造函数
123        public Guage()
124        {
125            // 初始化进度条的背景颜色、字体颜色和边框颜色
126            BackColor = System.Drawing.Color.LightGray;
127            ForeColor = System.Drawing.Color.Blue;
128            BorderColor = Color.Empty;
129
130            //初始化进度条的宽度和高度
131            base.Width = Unit.Pixel(100);
132            base.Height = Unit.Pixel(16);
133
134        }
135        #endregion
136
137        取得进度条百分比#region 取得进度条百分比
138        /**//// <summary>
139        /// 取得进度条的百分比
140        /// </summary>
141        /// <param name="MaxNum">总数量</param>
142        /// <param name="curValue">当前数量</param>
143        /// <returns></returns>
144        private int GetPercentage(int maxNum, int curNum)
145        {
146            int intLvalue = 0;
147            int intFvalue = (curNum * 100) / maxNum;
148            int intMvalue = (curNum * 100) % maxNum;
149            if (intMvalue > 0)
150            {
151                string strLvalue = intMvalue.ToString().Substring(0, 1);
152                if (int.Parse(strLvalue) > 4)
153                {
154                    intLvalue = int.Parse(strLvalue);
155                }
156            }
157            return intFvalue + intLvalue;
158        }
159
160        #endregion
161
162        /**//// <summary>
163        /// 进度条输出参数
164        /// </summary>
165        /// <param name="output"> 进度条 </param>
166        protected override void Render(HtmlTextWriter output)
167        {
168            if (Width.Type != UnitType.Pixel)
169            {
170                throw new ArgumentException("宽度必须为象素");
171            }
172
173            int intWidth = (int)Width.Value;//控件宽度
174
175            if (intPercentage == 0)
176            {
177                //进度条百分比
178                intPercentage = GetPercentage(intMaxNum, intCurNum);
179            }
180
181            if (BorderColor != Color.Empty)//进度条加边框
182            {
183                output.Write("<table border='0' cellspacing='0' cellpadding='1' bgColor='" +
184                ColorTranslator.ToHtml(BorderColor) + "'><tr><td>");
185            }
186            if (BarImageUrl == "")
187            {
188                output.Write("<table border='0' cellspacing='0' cellpadding='0' height='" + Height + "' bgColor='" + ColorTranslator.ToHtml(BackColor) + "'><tr>");
189                int intCellWidth = intWidth / intCellCount;
190                int intCurPercentage = 0;
191                int intPercentageStep = PercentageStep;
192                string strCellColor;
193                string strCellValue = "";
194
195                if (Page.Request.Browser.Browser.ToUpper() == "NETSCAPE")
196                {
197                    if (FillImageUrl != "")
198                    {
199                        strCellValue = "<img src='" + FillImageUrl + "' border='0' width='" + intCellWidth + "'>";
200                    }
201                    else
202                    {
203                        strCellValue = " ";
204                    }
205                }
206                for (int i = 0; i < intCellCount; i++, intCurPercentage += intPercentageStep)
207                {
208                    if (intCurPercentage < intPercentage)
209                    {
210                        strCellColor = " bgColor='" + ColorTranslator.ToHtml(ForeColor) + "'";
211                    }
212                    else
213                    {
214                        strCellColor = "";
215                    }
216
217                    if (i == 0)
218                    {
219                        output.Write("<td height='" + Height + "' width='" + intCellWidth + "'" + strCellColor + ">" + strCellValue + "</td>");
220                    }
221                    else
222                    {
223                        output.Write("<td width='" + intCellWidth + "'" + strCellColor + ">" + strCellValue + "</td>");
224                    }
225                }
226                output.Write("</tr></table>");
227            }
228            else
229            {
230                int intImageWidth = (int)((intPercentage / 100.0) * intWidth);
231
232                output.Write("<table border='0' cellpadding='0' cellSpacing='0' bgColor='" + ColorTranslator.ToHtml(BackColor) + "'><tr><td width='" + intWidth + "'>");
233                output.Write("<img src='" + BarImageUrl + "' width='" + intImageWidth + "' height='" + Height + "'>");
234                output.Write("</td></tr></table>");
235            }
236
237            if (BorderColor != Color.Empty)
238            {
239                output.Write("</td></tr></table>");
240            }
241        }
242
243    }
244}

第二步:在WEB项目下添加一个WEB文件:GuageDemo.aspx
代码如下:
     

 1<%@ Page Language="C#" AutoEventWireup="true" CodeFile="guageDemo.aspx.cs" Inherits="guageDemo" %>
 2<%@ Register Assembly="ZYT.Web.UI" Namespace="ZYT.Web.UI" TagPrefix="ZYTControl" %>
 3<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 4
 5<html xmlns="http://www.w3.org/1999/xhtml" >
 6<head runat="server">
 7    <title>无标题页</title>
 8</head>
 9<body>
10    <form id="form1" runat="server">
11    <div>
12    <ZYTControl:Guage ID="guage1" runat="server" CurNum="34" MaxNum="1000" Height="25px" Width="300px" PercentageStep="2" BarImageUrl="Guage/Images/3.jpg" FillImageUrl="Guage/Images/1.jpg" ImageGeneratorUrl="" />
13    </div>
14    </form>
15</body>
16</html>
17