在处理长任务，大数据交互是，程序容易造成假死，用户也不知道程序在做什么，于是就需要一个进度条，但是网上进度条实例，效果都不佳，都不能实时更新进度条，比如伪进度条就只能是一张图片，还有的是事务处理完后，记录监控的时间，再完成进度条显示，这肯定是不可以的。还有一种是比较实用，但是把事务处理随着进度条一起处理，也就是进度条是从1%到100%，那么事务就处理一百次。于是结合网上实例，我写了下面的这个多线程进度条。
我写的这个进度条的特点是：
可以根据事务处理的时间，实时更新进度条，简单的说是：比如一个长任务，大数据交互大概要话4分钟的话，那么我们就可以把进度条从1%到100%，每跟进一步，就是40微秒，当然这是多线程的。一个线程处理进度条，主线程处理长任务，大数据交互部分，也就是说如果一个长任务，大数据交互大于4分钟，那么进度条先执行完，但是进度条线程会让自己全部执行完，才把cup交给主线程。如果正常情况一个长任务，大数据交互小于或等于，那么正好是我们要的效果。
下面开始截图：
实际项目截图：单击提取：
测试截图图：
下面开始开代码：
1,新建web项目：
2.添加ProgressBar.htm页面;代码如下
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" id="mainWindow">
<head>
<title>足下教育</title>
<base target=_self />
<script language="javascript" type="text/javascript">
function SetPorgressBar(pos) {
//设置进度条居中
var screenHeight = window["mainWindow"].offsetHeight;
var screenWidth = window["mainWindow"].offsetWidth;
ProgressBarSide.style.width = Math.round(screenWidth / 2);
ProgressBarSide.style.left = Math.round(screenWidth / 4);
ProgressBarSide.style.top = Math.round(screenHeight / 2);
ProgressBarSide.style.height = "21px";
ProgressBarSide.style.display = "";
//设置进度条百分比
ProgressBar.style.width = pos + "%";
ProgressText.innerHTML = pos + "%";
}
//完成后隐藏进度条
function SetCompleted() {
ProgressBarSide.style.display = "none";
}
function exception() {
ProgressBarSide.style.display = "none";
}
</script>
</head>
<body style=" background-color:transparent">
<div id="ProgressBarSide" style="position:absolute;height:21px;width:100px;color:Silver;border-width:1px;border-style:Solid;display:none;background-color:transparent">
<div id="ProgressBar" style="position:absolute;height:21px;width:0%;background-color:#3366FF"></div>
<div id="ProgressText" style="position:absolute;height:21px;width:100%;text-align:center"></div>
</div>
</body>
</html>3.添加Demo.aspx页面
Demo.aspx 代码：
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Demo.aspx.cs" Inherits="web进度条1.Demo" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:button runat="server" text="Button" οnclick="Unnamed1_Click" />
</div>
</form>
</body>
</html>
Demo.aspx.cs代码：
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Threading;
using System.IO;
namespace web进度条1
{
public partial class Demo : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
#region 进度条方法
private void beginProgress()
{
//根据ProgressBar.htm显示进度条界面
string templateFileName = Path.Combine(Server.MapPath("."), "ProgressBar.htm");
StreamReader reader = new StreamReader(@templateFileName, System.Text.Encoding.GetEncoding("GB2312"));
string html = reader.ReadToEnd();
reader.Close();
Response.Write(html);
Response.Flush();
Thread thread = new Thread(new ThreadStart(ThreadProc));
thread.Start();
LoadData();//load数据
thread.Join();
}
private void setProgress(int percent)
{
Thread.Sleep(50);
string jsBlock = "<script>SetPorgressBar('" + percent.ToString() + "'); </script>";
Response.Write(jsBlock);
Response.Flush();
}
private void finishProgress()
{
string jsBlock = "<script>SetCompleted();</script>";
Response.Write(jsBlock);
Response.Flush();
Response.Clear();
}
private void exception()
{
string jsBlock = "<script>exception();</script>";
Response.Write(jsBlock);
Response.Flush();
Response.Clear();
}
#endregion
#region ThreadProc
private void ThreadProc()
{
for (int i = 1; i <= 100; i++)
{
setProgress(i);
}
}
#endregion
#region LoadData
private void LoadData()
{
//事务处理部分，下面注释的是我从数据库读取数据的测试
//using (DataSet ds = commonws.GetDsSql("病程信息", "Dome"))
//{
// datatRead();
//}
}
#endregion
protected void Unnamed1_Click(object sender, EventArgs e)
{
beginProgress();
finishProgress();
}
}
}下面附属一下别人的代码：
for(int i=0;i<11;i++)
{ //事务处理部分
- - - - - - -
//显示进度条
- - - - - -
}
上面的循环一百，事务处理也是一百次，这个效果是达到，貌似事务执行时间加长了很多？
难道循环体执行了一百遍，但是事务只执行了一遍吗？
本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。
