小編給大家分享一下ASP.NET實(shí)現(xiàn)進(jìn)度條的圖文實(shí)例，希望大家閱讀完這篇文章后大所收獲，下面讓我們一起去探討吧！

十載的民樂(lè)網(wǎng)站建設(shè)經(jīng)驗(yàn)，針對(duì)設(shè)計(jì)、前端、開(kāi)發(fā)、售后、文案、推廣等六對(duì)一服務(wù)，響應(yīng)快，48小時(shí)及時(shí)工作處理。成都全網(wǎng)營(yíng)銷(xiāo)的優(yōu)勢(shì)是能夠根據(jù)用戶設(shè)備顯示端的尺寸不同，自動(dòng)調(diào)整民樂(lè)建站的顯示方式，使網(wǎng)站能夠適用不同顯示終端，在瀏覽器中調(diào)整網(wǎng)站的寬度，無(wú)論在任何一種瀏覽器上瀏覽網(wǎng)站，都能展現(xiàn)優(yōu)雅布局與設(shè)計(jì)，從而大程度地提升瀏覽體驗(yàn)。創(chuàng)新互聯(lián)從事“民樂(lè)網(wǎng)站設(shè)計(jì)”,“民樂(lè)網(wǎng)站推廣”以來(lái)，每個(gè)客戶項(xiàng)目都認(rèn)真落實(shí)執(zhí)行。

我們先看下進(jìn)度條效果

我點(diǎn)擊了按鈕后他會(huì)顯示進(jìn)度頁(yè)面，進(jìn)度完成后，進(jìn)度條消失，其實(shí)也是比較簡(jiǎn)單的了。

我們需要一個(gè)進(jìn)度條代碼文件ProgressBar.htm（注意：是沒(méi)有head這些標(biāo)簽的）

<script language="javascript">
  function SetPorgressBar(pos) {
    //設(shè)置進(jìn)度條居中

    var screenWidth = document.body.offsetWidth;
    ProgressBarSide.style.width = Math.round(screenWidth / 2) + "px";
    ProgressBarSide.style.left = Math.round(screenWidth / 4) + "px";
    ProgressBarSide.style.top = "50px";
    ProgressBarSide.style.height = "21px";
    ProgressBarSide.style.display = "block";

    //設(shè)置進(jìn)度條百分比 
    ProgressBar.style.width = pos + "%";
    ProgressText.innerHTML = pos + "%";
  }

  function SetMaxValue(maxValue) {
    ProgressBarSide.style.width = maxValue + "px";
  }

  //完成后隱藏進(jìn)度條
  function SetCompleted() {
    ProgressBarSide.style.display = "none";
  }

  function SetTitle(title) {
    ProgressTitle.innerHTML = title;
  }
</script>
<p id="ProgressBarSide" style="position: absolute; height: 21px; width: 100px;
  color: Silver; border-width: 1px; border-style: Solid; display: block">
  <p id="ProgressBar" style="position: absolute; height: 21px; width: 0%; background-color: #1475BB">
  </p>
  <p id="ProgressText" style="position: absolute; height: 21px; width: 100%; text-align: center">
  </p>
  <p id="ProgressTitle" style="position: absolute; height: 21px; top: 21px; width: 100%;
    text-align: center">
  </p>
</p>

然后需要一個(gè)進(jìn)度條類(lèi)ProgressBar.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.IO;

namespace ZhuoYueE.Dop.Web.UI
{
  /// <summary>
  ///顯示進(jìn)度條
  /// </summary>
  public class ProgressBar : System.Web.UI.Page
  {
    /// <summary>
    /// 最大值
    /// </summary>
    private int MaxValue
    {
      get
      {
        if (ViewState["MaxValue"] == null)
        {
          return 0;
        }
        else
        {
          return Convert.ToInt32(ViewState["MaxValue"]);
        }
      }
      set
      {
        ViewState["MaxValue"] = value;
      }
    }
    /// <summary>
    /// 當(dāng)前值
    /// </summary>
    private int ThisValue
    {
      get
      {
        if (ViewState["ThisValue"] == null)
        {
          return 0;
        }
        else
        {
          return Convert.ToInt32(ViewState["ThisValue"]);
        }
      }
      set
      {
        ViewState["ThisValue"] = value;
      }
    }
    /// <summary>
    /// 當(dāng)前頁(yè)面
    /// </summary>
    System.Web.UI.Page m_page;
    /// <summary>
    /// 功能描述:構(gòu)造函數(shù)
    /// 作　　者:huangzh
    /// 創(chuàng)建日期:2016-05-06 11:54:34
    /// 任務(wù)編號(hào):
    /// </summary>
    /// <param name="page">當(dāng)前頁(yè)面</param>
    public ProgressBar(System.Web.UI.Page page)
    {
      m_page = page;
    }

    public void SetMaxValue(int intMaxValue)
    {
      MaxValue = intMaxValue;
    }

    /// <summary>
    /// 功能描述:初始化進(jìn)度條
    /// 作　　者:huangzh
    /// 創(chuàng)建日期:2016-05-06 11:55:26
    /// 任務(wù)編號(hào):
    /// </summary>
    public void InitProgress()
    {
      //根據(jù)ProgressBar.htm顯示進(jìn)度條界面
      string templateFileName = AppDomain.CurrentDomain.BaseDirectory + "ProgressBar.htm";
      StreamReader reader = new StreamReader(@templateFileName, System.Text.Encoding.GetEncoding("GB2312"));
      string strhtml = reader.ReadToEnd();
      reader.Close();
      m_page.Response.Write(strhtml);
      m_page.Response.Flush();
    }

    /// <summary>
    /// 功能描述:設(shè)置標(biāo)題
    /// 作　　者:huangzh
    /// 創(chuàng)建日期:2016-05-06 11:55:36
    /// 任務(wù)編號(hào):
    /// </summary>
    /// <param name="strTitle">strTitle</param>
    public void SetTitle(string strTitle)
    {
      string strjsBlock = "<script>SetTitle('" + strTitle + "'); </script>";

      m_page.Response.Write(strjsBlock);
      m_page.Response.Flush();
    }

    /// <summary>
    /// </summary>
    /// <param name="percent">percent</param>
    public void AddProgress(int intpercent)
    {
      ThisValue = ThisValue + intpercent;
      double dblstep = ((double)ThisValue / (double)MaxValue) * 100;

      string strjsBlock = "<script>SetPorgressBar('" + dblstep.ToString("0.00") + "'); </script>";

      m_page.Response.Write(strjsBlock);
      m_page.Response.Flush();
    }


    public void DisponseProgress()
    {
      string strjsBlock = "<script>SetCompleted();</script>";
      m_page.Response.Write(strjsBlock);
      m_page.Response.Flush();
    }
  }
}

然后就是調(diào)用方法了，調(diào)用很簡(jiǎn)單，在頁(yè)面的按鈕事件或者其他什么地方加入代碼，如在按鈕事件里這么用

protected void btnImport_Click(object sender, EventArgs e)
    {
      ProgressBar pb = new ProgressBar(this);
      pb.SetMaxValue(110);
      pb.InitProgress();
      pb.SetTitle("這是一個(gè)測(cè)試數(shù)據(jù)");
      for (int i = 1; i <= 110; i++)
      {
        pb.AddProgress(1);
        //此處用線程休眠代替實(shí)際的操作，如加載數(shù)據(jù)等
        System.Threading.Thread.Sleep(50);
      }
      pb.DisponseProgress();
    }

看完了這篇文章，相信你對(duì)ASP.NET實(shí)現(xiàn)進(jìn)度條的圖文實(shí)例有了一定的了解，想了解更多相關(guān)知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝各位的閱讀！

本文名稱：ASP.NET實(shí)現(xiàn)進(jìn)度條的圖文實(shí)例
網(wǎng)站鏈接：http://jinyejixie.com/article14/ggiode.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站設(shè)計(jì)、ChatGPT、外貿(mào)網(wǎng)站建設(shè)、自適應(yīng)網(wǎng)站、App開(kāi)發(fā)、靜態(tài)網(wǎng)站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)