Sencha Touch 2.0 进度指示器

Question

我必须使用 Sencha touch 2.x 在不同的 ajax 请求中添加完成百分比的进度指示器，例如，如果我有 2 个 Ajax 请求，进度指示器将显示 50服务器成功响应后每个请求的完成百分比。

Answer 1

这里有另一种不用progressIndicator的解决方法：

Ext.application({
    name : 'Fiddle',

    launch : function() {


        var progressIndicator = Ext.create('Ext.Panel', {
            html: '<table  style="height:30px; width:100%">'+
                  '<tr>'+
                  '<td id="start" style="background-color:green;width:1%"></td>'+
                  '<td id="end"></td>'+
                  '</tr></table>',
            centered : true,
            modal    : true,
            hideOnMaskTap : true,
            width    : '50%',
            height   : '80',
         });

        var progress = 1;

        //progressIndicator.updateBar();
        Ext.Viewport.add(progressIndicator);
        progressIndicator.show();


        var intervalProgress=setInterval(function(){
            //console.log(progress);
            progress+=1;

            document.getElementById("start").style.width = (progress) +'%';
            //progressIndicator.setProgress(progress);
            //progressIndicator.updateBar();
            if(progress >= 100){
                clearInterval(intervalProgress)
            }
        },100)
    }
});

Sencha Touch 2.0 进度指示器

Sencha Touch 2.0 Progress Indicator

extjs

sencha-touch-2

sencha-touch-2.1