Question

目前，我正在尝试在发出HTTP请求时显示一个微调器，该请求将在调用完成时结束。我已经建立了几个不同的微调器，但所有停止动画的第二个调用开始。

var spinnerArray = [];
for (var i = 0; i < 20; i++) {
    spinnerArray.push('/images/preloaderGif/preloader'+ ("0" + i).slice(-2) + '.gif');
}
$.spinner.images = spinnerArray; 
$.spinner.duration = "200"; 
$.spinner.repeatCount = "0";

spin();

function spin(){
    $.spinner.start();
    callHTTP() //Prewritten function
    Ti.App.addEventListener('callEnd', function(e){
        $.spinner.stop();
    });
}

这导致旋转器永远不会出现。取消调用或将其嵌套在超时内会导致微调器无限旋转，或直到超时结束。

有没有办法让微调器继续旋转通话？

Answer 1

实际上，有一个更好的＆amp;超级简单的方式来显示指标。请按照以下步骤操作。

下载此小部件 Loading Indicator Widget ＆amp;将其添加到 app-＆gt;小部件文件夹中的项目中。创建小部件文件夹（如果它不存在）。
将此行"nl.fokkezb.loading" : "*"添加到dependencies词典中的 app-＆gt; config.json 文件中，如下面的屏幕截图所示。
在 alloy.js 文件中添加 Alloy.Globals.loading = Alloy.createWidget("nl.fokkezb.loading");

最后，您可以在调用HTTP请求时使用此代码正确显示/隐藏指示符。

function callHTTP() {
    if (!Ti.Network.online) {
       return;
    }

    Alloy.Globals.loading.show();

    var xhr = Ti.Network.createHTTPClient({
        onerror : function(e) {
            Alloy.Globals.loading.hide();

        },

        onload : function(e) {
            Alloy.Globals.loading.hide();

           // run your additional code here
        },
    });

    xhr.open("GET", url);
    xhr.send();
}


callHTTP();

使用此小部件，您不需要为不同的项目编写长且容易出错的代码。只需添加此小部件＆amp;只需2行代码即可显示/隐藏加载指示器。

请记住，XHR 错误/成功回调是唯一可以编写代码来隐藏指标的地方，因为您无法确定HTTP请求何时完成。

Answer 2

您可以使用ActivityIndicator：http://docs.appcelerator.com/platform/latest/#!/api/Titanium.UI.ActivityIndicator

$.activityIndicator.show();
var xhr = Ti.Network.createHTTPClient({
    onerror : function(e) {
        // code
        $.activityIndicator.hide();
    },
    onload : function(e) {
        // code
        $.activityIndicator.hide();
    },
});

xhr.open("GET", url);
xhr.send();

如何在发出HTTP请求时显示微调器（Appcelerator）

2 个答案: