Asp. NET how to achieve the effect of the progress bar example analysis

Source: Internet
Author: User
This article is mainly for you to introduce the net to achieve a simple progress bar effect, with a certain reference value, interested in small partners can refer to

Let's look at the progress bar effect first

When I click on the button, he will display the progress page, the progress after the completion of the progress bar disappears, in fact, it is relatively simple.

We need a progress bar code file progressbar.htm (Note: There is no head for these tags)

<script language= "JavaScript" > Function Setporgressbar (POS) {//Set progress bar Center var screenwidth = DOCUMENT.BODY.OFFSE    Twidth;    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";    Set the progress bar percentage ProgressBar.style.width = pos + "%";  progresstext.innerhtml = pos + "%";  } function Setmaxvalue (maxValue) {ProgressBarSide.style.width = MaxValue + "px";  }//After completion, hide the progress bar 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>

The

Then requires a progress bar class ProgressBar.cs

Using system;using system.collections.generic;using system.linq;using system.web;using System.IO;namespace  zhuoyuee.dop.web.ui{//<summary>///Show progress bar///</summary> public class ProgressBar:System.Web.UI.Page {//<summary>///maximum value//</summary> private int MaxValue {get {if (Viewst        ate["MaxValue"] = = null) {return 0;        } else {return Convert.ToInt32 (viewstate["MaxValue"]);      }} set {viewstate["MaxValue"] = value; }}///<summary>///Current value//</summary> private int Thisvalue {get {if (        viewstate["Thisvalue"] = = null) {return 0;        } else {return Convert.ToInt32 (viewstate["Thisvalue"]);      }} set {viewstate["thisvalue"] = value; }}///<summary>//Current page//</summary> System.Web.UI.Page m_Page <summary>///Function Description: Constructor///Author: Huangzh//Date Created: 2016-05-06 11:54:34///Task No:///</summary&    Gt    <param name= "page" > current page </param> public ProgressBar (System.Web.UI.Page page) {m_page = page;    } public void Setmaxvalue (int intmaxvalue) {MaxValue = Intmaxvalue; }///<summary>///Function Description: Initialize the progress bar///Author: Huangzh//Date Created: 2016-05-06 11:55:26///Task No:///&LT;/S ummary> public void Initprogress () {//progressbar.htm display progress bar interface by string templatefilename = Appdomain.cur      Rentdomain.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>///Function Description: Set the title///Author: Huangzh//Date Created: 2016-05-06 11:55:36///Task No:///</sum Mary>//<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>///Function Description: Set progress///Author: Huangzh//Date Created: 2016-05-06 11:55:45///Task No:///</sum mary>//<param name= "percent" >percent</param> public void addprogress (int intpercent) {Thi      svalue = 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 (); }  }}

Then it's called the method, and the call is simple to add code to the page's button event or somewhere else, such as in a button event.

protected void Btnimport_click (object sender, EventArgs e)    {      ProgressBar PB = new ProgressBar (this);      Pb. Setmaxvalue (a);      Pb. Initprogress ();      Pb. Settitle ("This is a test data");      for (int i = 1; i <=; i++)      {        PB. Addprogress (1);        Here, thread hibernation is used instead of the actual operation, such as loading data such as        System.Threading.Thread.Sleep ();      }      Pb. Disponseprogress ();    }

How about, isn't it very simple.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.