kso经验记录 -- winform进度条控件与html进度简单实现

最新推荐文章于 2024-05-25 09:36:25 发布

kso、

最新推荐文章于 2024-05-25 09:36:25 发布

阅读量225

点赞数 1

文章标签：进度条 html进度条 winform进度条 js实现进度条

本文链接：https://blog.csdn.net/weixin_44320901/article/details/103505846

版权

winform进度条

1.设计思想

本地的进度条还是比较好实现的，直接拉控件progressBar与timer控件，结合使用，设置时间使进度条控件progressBar ，一步步的增加，让我们看到了进度条一步步往前走的效果。`

实现代码

if (progressBar1.Value == progressBar1.Maximum)
	 {  
				label1.Text = Form1.tishi;
				label1.Text = "正在导入，请稍后.....";
				progressBar1.Value = 0; 
	 }
			progressBar1.PerformStep();

效果图

html实现进度条

设计思想
首先底层是一个div块，上面放一个 <div class="sp1"></div>再设置高设置一个合适的长度，长度首先设置为0，或者设置为1，设置成与div不一样的颜色，在运行的时候直接用js一点一点增加span 的长度，这样就可以了。
代码

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>进度条</title>
    <script src="jquery-3.4.1.js"></script>
    <script type="text/javascript">
        $(function () {
            $(".btu1").click(function () {
                var begin = 1;
                var end = $(".div1").width();
                var time = setInterval(ters ,10);
                function ters() {
                    if (begin == end) {
                        clearInterval(time);
                    } else {
                        begin += 1;
                        $(".sp1").css("width",begin) ;
                    } }
            });
        })
    </script>
    <style type="text/css">
        .div1 {
        height:15px;
        width:1400px;
        border:1px solid 	MediumSlateBlue;
        }
        .sp1 {
        height:15px;
        width:1px;
        background-color:Orchid;
          border:1px solid 	MediumSlateBlue;
        }
    </style>
</head>
<body>

    <div class="div1">
        <div class="sp1"></div>
    </div>
    <br /><br /><br />
    <input type="button" name="name" class="btu1" value="运行进度条" />
</body>
</html>

效果图

在这里插入图片描述

总结

其实不论是本地程序还是网页，基本的原理都是一样的，一点一点的增加它的宽度，来达到进度条的效果。

在winform中，运行进度条会使程序卡死，所以千万别忘了使用多线程，一个运行主方法，另一个运行进度条效果。
希望在下的经验帮助大家.

kso、

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
kso经验记录 -- winform进度条控件与html进度简单实现

winform进度条1.设计思想本地的进度条还是比较好实现的，直接拉控件progressBar与timer控件，结合使用，设置时间使进度条控件progressBar ，一步步的增加，让我们看到了进度条一步步往前走的效果。`实现代码if (progressBar1.Value == progressBar1.Maximum) { label1.Text = Form1.t...
复制链接

扫一扫