使用Appcelerator创建动态ImageViews并通过HTTP GET填充

Creating Dynamic ImageViews and populating via HTTP GET using Appcelerator

本文关键字:HTTP GET 填充 Appcelerator 创建 动态 ImageViews 使用      更新时间:2023-09-26

就一个。

我有一个TableView是由一个HTTP GET请求填充到一个API。它在iOS和Android上使用Appcelerator返回混合文本,图像,电影等。

我已经把所有的东西都布置好了,工作得很好,但是当我循环遍历图像时,我的tableView中只有最后一项被填充了图像,而不是所有的。

我怀疑这是因为imageView没有唯一的名称。我不得不做的for循环内的请求,因为这是API的设置方式,每个下载必须单独请求。

有什么办法吗?

函数getMedia(itemID, mediaType)是我下载并将其应用于imageView的地方。

var f = Ti.Filesystem.getFile(Ti.Filesystem.applicationDataDirectory, itemID + '.png');
f.write(this.responseData); // write to the file
postImage.image = f.nativePath;
下面是我的代码:
var xhr = Ti.Network.createHTTPClient({
    onerror: function() {
        // hide the table
        exploreTableView.visible = false;
    },
    onload: function() {
        // parse the retrieved data, turning it into a JavaScript object
        json = JSON.parse(this.responseText);
        Ti.API.info(json);

        // don't build the table if no posts have been made
        if (json.length == 0) {
            tableData = [];
            //holdingLabel.visible = true;
            exploreTableView.visible = false;
        } else {
            //holdingLabel.visible = false;
            exploreTableView.visible = true;
            for (i = 0; i < json.length; i++) {
                // check if this has been deleted, if so, skip it and move on!
                if (json[i].status == "alive") {

                    row = Ti.UI.createTableViewRow({
                        height: 'auto',
                        bottom: 10,
                        selectedBackgroundColor: 'transparent',
                        //editable: deleteRow,
                        layout: 'vertical'
                    });


                    var postView = Ti.UI.createView({
                        top: 0,
                        height: Ti.UI.SIZE,
                        layout: 'vertical'
                    });
                    // detect what media we have

                    // show an image if there is an image uploaded
                    if (json[i].type == "image/jpeg") {
                        var postImage = Ti.UI.createImageView({
                            image: 'images/bcell-square-picture-pre-load.png',
                            defaultImage: 'bcell-square-picture-pre-load.png'
                        });
                        postView.add(postImage);
                        getMedia(json[i]._id, "photo");
                    }

                    row.add(postView);
                    tableData.push(row);
                    // set some variables to access
                    row.itemID = json[i]._id;

                    function getMedia(itemID, mediaType) {
                        // let's fetch the media for the post
                        if (mediaType == "photo") {
                            var url = "https://myapi.com/";
                        }

                        var xhr = Ti.Network.createHTTPClient({
                            onload: function() {
                                // handle the response
                                Ti.API.info('Media: ' + this.responseData);
                                var f = Ti.Filesystem.getFile(Ti.Filesystem.applicationDataDirectory, itemID + '.png');
                                f.write(this.responseData); // write to the file
                                postImage.image = f.nativePath;
                            }
                        });
                        xhr.open("GET", url);
                        // set the header for the correct JSON format
                        xhr.setRequestHeader("xxx", Ti.App.Properties.getString('token'));
                        // send the data to the server
                        xhr.send();
                    }

                }

            }

        }
        exploreTableView.setData(tableData);
    }

});
xhr.open("GET", url);
xhr.setRequestHeader("xxx", Ti.App.Properties.getString('token'));
// send the data to the server
xhr.send();

任何帮助都是感激的!

西蒙

由于您在不同的函数中下载图像,postImage链接到最后一个元素,因为当图像出现时循环已经完成。当您将postImage作为参数传递给getMedia时,它应该工作