extjs - Sencha Touch 2.0 进度指示器

Question

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

标签： extjssencha-touch-2sencha-touch-2.1

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