Question

Scienario：

我有一个窗口，我通过http协议远程获取数据。什么是钛的最佳方法，以防止窗口过早显示数据。

在许多移动应用程序中，他们通过加载指示器解决了这个问题，每次打开窗口时，如何在钛合金中执行此操作？

$.window.addEventListener('load',function(){
..
//some text
..
});

我试过这个，但我不知道下一步该做什么，因为我的异步方法是在它之外触发的。所以不确定这是否会产生任何影响。

感谢

从jquery翻译：

   $.ajaxSetup({
        beforeSend: function() {
            // show loading overlay gif
            $("#Loading").show();

        },
        complete: function() {
            // hide loading overlay gif
               $("#Loading").hide();
        }
    });

    $.ajax({
        type: "GET",
        url: url,
        data: param = "",
        contentType: "application/json; charset=utf-8",
        success: doSomething,
        error: errorFunction
    });
};

Ajax设置意味着每次触发Ajax请求时，屏幕上都会出现加载覆盖，直到收到响应。我怎样才能在钛中实现同样的目标？

更新

这是一个很好的方法吗？

Albums.JS

function getAlbumCovers() {
    //first check to see if profile pics already exist in user model

    //create a collection
    var usersCollection = Alloy.Collections.user;

    facebookModule.requestWithGraphPath('me/albums', {
        fields : 'id,name,cover_photo,count,created_time'
    }, 'GET', function(graphResp) {
        //show view indicator before data is fetched
        $.view_indicator.visible = true;
        if (graphResp.success) {
            if (graphResp.result) {

                var rows = [];
                var data = JSON.parse(graphResp.result).data;

                for (x in data) {
                    Ti.API.debug(JSON.stringify(data[x]));

                    if (data[x].name == "Profile Pictures") {

                        var row = Titanium.UI.createTableViewRow({
                            width : '100%',
                            height : 'auto'
                        });
                        var image = Titanium.UI.createImageView({
                            image : "https://graph.facebook.com/" + (data[x].cover_photo || 0) + "/picture?access_token=" + Ti.Facebook.accessToken,
                            top : 0,
                            left : 0,
                            width : 100,
                            height : 100
                        });
                        var title = Titanium.UI.createLabel({
                            text : String.format("%s (%d)", data[x].name, data[x].count),
                            top : 0,
                            left : 110,
                            width : 'auto',
                            height : 'auto'
                        });
                        row.add(image);
                        row.add(title);
                        rows.push(row);

                    } else {

                        break;

                    }

                }

                //set table rows
                $.tableview.setData(rows);

                //end
            }

            $.view_indicator.visible = false;

        } else {
            if (e.error) {
                alert(e.error);
            } else {
                alert("Unkown result");
            }
        }
    });

}

Albums.XML

<Alloy>
    <Window id="win" backgroundColor="white">
        <LeftNavButton>
            <Button id="lbtn" onClick="rightButtonClicked" />
        </LeftNavButton>
        <RightNavButton>
            <Button id="btnRight" onClick="rightButtonClicked" />
        </RightNavButton>
        <View id = "view_indicator">
            <ActivityIndicator id="ind" />
        </View>
        <TableView id="tableview"></TableView>
    </Window>
</Alloy>

App.tss

//覆盖

//loading overlay to cover full screen
"#view_indicator": {
    backgroundColor : '#000',
    opacity : 0.6,
    width : '100%',
    height : '100%',
    borderRadius : 5,
    zIndex: 20,
    visible : false
},
"#ind": {
    style : Ti.UI.iPhone.ActivityIndicatorStyle.BIG,
    visible : true
},

在这个例子中，我调用了Facebook api，并在$.view_indicator.visible = true;函数之前放置了if (graphResp.success) {。一旦if (graphResp.success) {被击中，就会删除加载叠加层。

这个想法是，最终用户必须等待表填充才能看到tableview。

我不确定这是否是正确的方法。有人确认，欢呼。

Answer 1

您可以通过在`HTTPClient中的onload回调结束时调用window.open()来实现此效果。

var window = Ti.UI.createWindow();

var http = Ti.Network.createHTTPClient({
    onload: function(e) {
        var response = this.responseText;
        /* Add views to window based on response */
        window.open();
    }
});

http.open('GET', url);
httpCallbackDecorator(http);
http.send();


function httpCallbackDecorator(http) {
    var onloadCallback = http.onload;
    var onerrorCallback = http.onerror;

    http.onload = function(event) {
        onloadCallback.call(this, event);
        hideLoadingIndicator();
    }

    http.onerror = function(event) {
        onerrorCallback.call(this.event);
        hideLoadingIndicator();
    }
}

Titanium，等待在显示窗口之前远程获取和下载文件

1 个答案: