使用ExtJS顯示連續的ProgressBar

問題： - 我需要嵌入一個持續運行的進度條，直到完成操作。 ExtJS的提供了進度條Ext.Progressbar這將： -
一）連續運行使用等待方法
b）中更新所述的UpdateProgress方法後運行。使用ExtJS顯示連續的ProgressBar

在進度的同時輸出的情況下將是

alt text

我試圖用於解決方法是： -
步驟1： alt text
步驟2：
步驟3：

Kindl我建議我一個解決方案或方法。我正在使用的JavaScript庫是ExtJS。提前致謝。

鏈接簡稱爲例如： -
http://dev.sencha.com/deploy/dev/examples/simple-widgets/progress-bar.html

來源

2010-12-23 vedvrat13

這裏有一個簡單的方法：你可以創建一個GIF動畫，顯示出您所描述的連續進度條：

動態地開始創建一個與GIF作爲SRC img元素你的操作
去除完成img元素

，或者如果你想顯示空進步黨操作S前杆和結束後的完整進度條：

包括與src屬性指向空進度條
更新IMG SRC來指代動畫GIF的圖像的img元素
更新IMG SRC指全進度條的圖像在年底

來源

2010-12-23 09:05:00

我收集的Ext JS用來提供一個不確定的進度條在三年前，在0.4;然而，由於瀏覽器可以停止動畫GIF的方式，它已被刪除。您可以使用該論壇帖子中指出的樣式恢復它 - 使用類似Firebug的東西來查看您應該設計的樣式。

Forum reference

來源

2010-12-23 09:03:10

使用JavaScript的另一種方法：你可以動畫彩色DIV的父專區內的左邊距（進度指示器）（中進度條），使用setTimeout或簡單的ani mation庫，如emile.js

ExtJS也提供了一個可選的動畫設置的分機。元素類：

你可以調用setX的（X，動畫）與可選的參數在每一步驟
上的進度指示器的動畫或插入進度指示器之前一個透明的「推動器」元件，並調用setWidth（寬度，動畫）推進進度指示器

在這兩種情況下，您都應該在動畫選項中提供完成回調來重置動畫和循環。

來源

2010-12-23 09:17:29

Ext.get('buttonID').on('click', function(){ 
    Ext.MessageBox.show({ 
     msg: 'Saving your data, please wait...', 
     progressText: 'Saving...', 
     width:300, 
     wait:true, 
     waitConfig: {interval:200}, 
     icon:'ext-mb-download', 
     animEl: 'buttonID' 
    }); 
    setTimeout(function(){ 
     //This simulates a long-running operation like a database save or XHR call. 
     //In real code, this would be in a callback function. 
     Ext.MessageBox.hide(); 
     Ext.example.msg('Done', 'Your fake data was saved!'); 
    }, 8000); 
});

來源

2010-12-23 11:15:32 Deeptechtons

使用ExtJS顯示連續的ProgressBar

回答

相關問題