玩转用户控件-统计控件1

今天做一个项目需要做个统计的条形显示；

对于没做过的朋友提供参考；

废话就不多说，开始

前台代码：

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="PointProgess.ascx.cs"

    Inherits="UserControl_PointProgess" %>

<table id="htmlTblProgress"  runat="server" style="background-color: Silver;" border="0" cellpadding="1" cellspacing="0">

    <tr>

        <td>

            <div id="divProgress" style="background-color: Black;" runat="server">

                &nbsp;

            </div>

        </td>

    </tr>

</table>

后台代码：

using System;

using System.Collections.Generic;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

public partial class UserControl_PointProgess : System.Web.UI.UserControl

{

    int _MaxValue = 10;

    int _CurrentValue = 1;

    int _ProgressWidth = 100;

    int _ProgressHeight = 10;

    #region 属性

    /// <summary>

    /// 设置最大值

    /// </summary>

    public int MaxValue

    {

        get

        {

            return this._MaxValue;

        }

        set

        {

            this._MaxValue = value;

        }

    }

    /// <summary>

    /// 设置当前值

    /// </summary>

    public int CurrentValue

    {

        get

        {

            return this._CurrentValue;

        }

        set

        {

            this._CurrentValue = value;

        }

    }

    /// <summary>

    /// 设置显示条长度

    /// </summary>

    public int ProgressWidth

    {

        get

        {

            return this._ProgressWidth;

        }

        set

        {

            this._ProgressWidth = value;

        }

    }

    /// <summary>

    /// 设置显示条高度

    /// </summary>

    public int ProgressHeight

    {

        get

        {

            return this._ProgressHeight;

        }

        set

        {

            this._ProgressHeight = value;

        }

    }

    #endregion

    protected void Page_Load(object sender, EventArgs e)

    {

        ShowProgress();

    }

    /// <summary>

    /// 显示显示条

    /// </summary>

    protected void ShowProgress()

    {

        htmlTblProgress.Height = this._ProgressHeight+"px";

        htmlTblProgress.Width = this._ProgressWidth+"px";

        

        //计算要显示的长度

        int divWidth = (this._CurrentValue * this._ProgressWidth) / this._MaxValue;

        if (divWidth > this._ProgressWidth)

        {

            divWidth = this._ProgressWidth;

        }

        if (divWidth < 0)

        {

            divWidth = 0;

        }

        //设置计算出来的长度到显示DIV

        divProgress.Style.Add(HtmlTextWriterStyle.Width, divWidth+"px");

        //设置显示高度，这个必须和htmlTblProgress.Height 一起设置

        divProgress.Style.Add(HtmlTextWriterStyle.Height, _ProgressHeight + "px");

    }

}

/********************************

*  是不是很简单，就这么完成了。

*  只要在调用页面引用就可以使用了。

********************************/