`
raymond.chen
  • 浏览: 1445780 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

Ext.ProgressBar的使用

阅读更多

1、手工模式的进度条
      调用格式:updateProgress([Float value], [String text])
      参数说明:
            value:0~1之间的数字,默认为0。
            text:进度条上显示的文字。
      范例:

Ext.onReady(function(){
	var obj = new Ext.ProgressBar({
		text: "working...",
		width: 300,
		renderTo: "div1" 
	});
	
	var count = 0; //刷新次数
	var per = 0; //进度百分比
	var progressText = ""; //进度条信息
	
	//任务管理器
	Ext.TaskMgr.start({
		run: function(){
			count++;
			if(count>10){
				//obj.hide(); //隐藏
				//Ext.TaskMgr.stop(this); //停止任务
				count = 0;
			}
			per = count/10;
			progressText = per*100 + "%";
			obj.updateProgress(per, progressText);
		},
		interval: 1000
	});
});

 

2、自动模式的进度条
      调用格式:wait([Object config])
      参数说明:
            config:配置对象。相关配置项如下:
                  duration:设定进度条在被重置之前要运行的时间长度,单位为毫秒,如果忽略该项则进度条会持续更新直到调用reset方法。
                  fn:回调函数,在进度条更新完毕后被调用。当duration不存在时会被忽略。
                  interval:更新进度条的时间间隔,单位为毫秒,默认值为1000毫秒。
                  increment:进度条的分段数量,默认为10。
      范例: 

Ext.onReady(function(){
	var obj = new Ext.ProgressBar({
		text: "working...",
		width: 300,
		renderTo: "div2"
	});
	
	obj.wait({
		duration: 15000,
		fn: function(){
			alert("执行完毕!");
		},
		interval: 100,
		increment: 150
	});
});

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics