Ext.ProgressBar xtype: progressbar

齐昊苍
2023-12-01
概述
一个可更新的进度条组件。该进度条支持两种模式:手动模式和自动模式。
In manual mode, you are responsible for showing, updating (via updateProgress) and clearing the progress bar as needed from your own code.
在手动模式下,您根据需要手写代码负责进度条的显示,更新(通过UpdateProgress)清除。
This method is most appropriate when you want to show progress throughout an operation that has predictable points of interest at which you can update the control.
当你可以控制显示进度点时,这种方法是最合适的。


In automatic mode, you simply call wait and let the progress bar run indefinitely, only clearing it once the operation is complete.
You can optionally have the progress bar wait for a specific amount of time and then clear itself.
Automatic mode is most appropriate for timed operations or asynchronous operations in which you have no need for indicating intermediate progress.
在自动模式下,只需调用等待,并让进度条无限期运行,只在操作完成后才清除它。
您可以选择有进度栏等待特定的时间,然后清除自己。
自动模式是最适合计时操作或异步操作,其中不需要指示中间进度。

var p = Ext.create('Ext.ProgressBar', {
    renderTo: Ext.getBody(),
    width: 300
});

// Wait for  seconds, then update the status el (progress bar will auto-reset)
p.wait({
    interval: 1000, //每1秒更新一次
    duration: 10000, //进度条持续更新10秒钟
    increment: 10,   //进度条分10次更新完毕 
    text: 'Updating...',
    scope: this,  //回调函数执行范围  
    fn: function() {
        p.updateText('Done!');
    }
});


上面官方例子,看到创建了一个进度条组件对象,调用了其wait公共方法。
wait : Ext.ProgressBar CHAINABLE
Initiates an auto-updating progress bar.
A duration can be specified, in which case the progress bar will automatically reset after a fixed amount of time and optionally call a callback function if specified.
If no duration is passed in, then the progress bar will run indefinitely and must be manually cleared by calling reset.
初始化一个自动更新进度条。
可以指定一个持续时间,在这种情况下,进度条将在一段固定的时间后自动重置,如果指定的话,可以选择调用回调函数。
如果没有持续时间传递,则进度条将无限期运行,并且必须通过调用重置手动清除。


总结:
duration :指定持续时间,到了执行定义的回调函数。 设定进度条在被重置之前要运行的时间长度,单位毫秒。 
interval:决定了进度条移动快慢。设定进度条在被重置之前要运行的时间长度,单位毫秒。 
increment:进度条分段数量。设定进度条的分段数量,也就是进度条分多少次完成更新。默认为10次。实际次数超过之后会重置。
text: 设定进度条上显示地文字。
fn: Function 设定在进度条更新完毕之后被调用,该回调函数没有参数。
 类似资料:

相关阅读

相关文章

相关问答