Sencha Touch 2.0进度指示器

时间:2018-05-22 11:46:35

标签: extjs sencha-touch-2 sencha-touch-2.1

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

1 个答案:

答案 0 :(得分:-1)

这是另一种没有progressIndicator来解决它的方法:

FIDDLE

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)
    }
});