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

Question

快点。

我有一个 TableView，正在通过对 API 的 HTTP GET 请求进行填充。它 returns 在 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();

感谢任何帮助！

西蒙

Answer 1

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

时它应该可以工作

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

Creating Dynamic ImageViews and populating via HTTP GET using Appcelerator

javascript

android

ios

appcelerator

appcelerator-titanium