Titanium Appcelerator表视图堆叠在彼此之上

Question

我正在为一个活动开发iPhone应用程序，我必须在第1周或第2周或所有（默认）建立一个“亭子”表。

我的问题是，当点击过滤到第1周或第2周的标签栏时，它会在现有表格视图的上方绘制新表格行/列表。

我确信这是一个简单的修复，但我似乎无法弄明白。我将代码略微删除以简化它：

var mac_addy = Titanium.Platform.macaddress;
var win = Titanium.UI.currentWindow;

win.backgroundImage = 'backs/pavilions_background.jpg';
win.backgroundRepeat = 'no-repeat';

var xmlHttp = null;

function api_load(api_params) {  
   var rowData = [];
   var loader = Titanium.Network.createHTTPClient();

// Sets the HTTP request method, and the URL to get data from  
loader.open("GET","http://example.com/api/?pavilions-week="+api_params+"&mac="+mac_addy);  

//loader.setInterval([10000]);

// Runs the function when the data is ready for us to process  
loader.onload = function() { 
    var api_data = eval('('+this.responseText+')');   

    //alert(api_data.pavilions_week[0].pavilion_name);

    var api_total = objectLength(api_data.pavilions_week);
    //alert(api_total);

    var api_whatever = api_total * 3;

    var pavilion_loop = 0;

    for (var i = 0; i < api_whatever; i = i + 3) { 
        var data_line  = api_data.pavilions_week[pavilion_loop]; 

        //alert(data_line.media_content.file_url);
        // Create a row and set its height to auto  
        var row = Titanium.UI.createTableViewRow({height:100, top:10, left:10, right:10, borderRadius:10, hasChild:true, test:'pavilion_profile.js', pav_id:data_line.id, backgroundColor:'#ffffff', header:''});  
        // Create the view that will contain the text and avatar  
        var post_view = Titanium.UI.createView({ height:100, width:226, top:5, left:70, layout:'vertical' });  

        var flag =  Titanium.UI.createImageView({
            image:data_line.media_content.file_url,
            width:50,
            height:50,
            left:10,
            top:5
        });

        var week =  Titanium.UI.createImageView({
            image:'icons/week_'+data_line.pavilion_week+'.png',
            width:50,
            //height:'auto',
            right:-10,
            top:75,
            bottom:0
        });

        var star_path = '';

        if (data_line.pav_rating != '') {
            if (data_line.pav_rating == undefined) {
                star_path = 'icons/stars_0.png';
            }
            else {
                star_path = 'icons/stars_'+data_line.pav_rating+'.png';
            }
        }
        else {
            star_path = 'icons/stars_0.png';
        }

        var stars =  Titanium.UI.createImageView({
            image:star_path,
            width:50,
            //height:'auto',
            left:70,
            top:75
        });



        row.add(flag);
        row.add(week);
        row.add(stars);


        // Create the label to hold the screen name  
        var user_lbl = Titanium.UI.createLabel({  
             text:data_line.pavilion_name,  
             //left:55,    
             top:0,  
             bottom:2,  
             height:18,  
             textAlign:'left',  
             color:'#444444',
             font:{  
                 fontFamily:'Trebuchet MS',fontSize:16,fontWeight:'bold'  
             }  
         });  

        post_view.add(user_lbl);

        // Create the label to hold the tweet message  
        var tweet_lbl = Titanium.UI.createLabel({  
            text: data_line.pavilion_description,    
            top: 0,   
            height: 'auto',  
            //width: 220,  
            right:20,
            textAlign: 'left',  
            font:{ fontSize:11 }
            //borderWidth:1,
            //borderColor:'#444444'
        });  

        post_view.add(tweet_lbl);


        var st_title = 'Showtimes:';
        var st_line = 'Sorry you missed it!';

        var hr_title = 'Hours:';
        var hr_line = 'Sorry you missed it!';

        if (api_data.system.fest_week < data_line.pavilion_week) {
            st_title = 'Future Showtimes:';
            st_line = data_line.showtimes;

            hr_title = 'Future Hours:';
            hr_line = data_line.hours_of_op;
        }
        else if (api_data.system.fest_week == data_line.pavilion_week) {
            st_title = 'Today\'s Showtimes:';
            st_line = data_line.showtimes;

            hr_title = 'Today\'s Hours:';
            hr_line = data_line.hours_of_op;
        }

        // ##############################################################################

        var showtimes_line = Titanium.UI.createTableViewRow({ 
            width:290,
            height:'auto',
            top:135,
            backgroundColor:'#ffffff'
        });

        //row.add(showtimes_line);


        var show_1 = Titanium.UI.createLabel({  
             text: st_title,  
             height:'auto',
             color:'#444444',
             font:{  
                 fontSize:11,
                 fontWeight:'bold'
             },
             left:10,
             width:220,
             top:5
         });

        var show_2 = Titanium.UI.createLabel({  
             text: st_line, //data_line.showtimes,  
             height:'auto',
             color:'#444444',
             font:{  
                 fontSize:11  
             },
             left:10,
             top: 20,
             bottom:5,
             width:220
         });

        showtimes_line.add(show_1);
        showtimes_line.add(show_2);

        if (data_line.dinner_rsrv == 'y') {
            var dinner_icon =  Titanium.UI.createImageView({
                image:'icons/dinner_s.png',
                width:25,
                height:30,
                right:10,
                top:5,
                bottom:5
            });

            showtimes_line.add(dinner_icon);
        }

        // ##############################################################################


        // ##############################################################################

        var hours_line = Titanium.UI.createTableViewRow({ 
            width:290,
            height:'auto',
            title:'',
            hasChild:false,
            backgroundColor:'#ffffff'
        });

        //row.add(hours_line);
        //rowData.push(hours_line);

        var hour_1 = Titanium.UI.createLabel({  
             text: hr_title,  
             height:'auto',
             color:'#444444',
             font:{  
                 fontSize:11,
                 fontWeight:'bold'
             },
             left:10,
             width:220,
             top:5
         });

        var hour_2 = Titanium.UI.createLabel({  
             text: hr_line, //data_line.showtimes,  
             height:'auto',
             color:'#444444',
             font:{  
                 fontSize:11  
             },
             left:10,
             top: 20,
             bottom:5,
             width:220
         });

        if (data_line.late_night == 'y') {
            var party_icon =  Titanium.UI.createImageView({
                image:'icons/nite_party_s.png',
                width:25,
                height:30,
                right:10,
                top:5,
                bottom:5
            });

            hours_line.add(party_icon);
        }

        hours_line.add(hour_1);
        hours_line.add(hour_2);

        // ##############################################################################

        // Add the post view to the row  
        row.add(post_view);  

        // Give each row a class name  
        row.className = "item" + i;  

        // Add row to the rowData array  
        rowData[i] = row;

        var i1 = i + 1;
        var i2 = i + 2;

        rowData[i1] = showtimes_line;
        rowData[i2] = hours_line;

        //alert(i);

        pavilion_loop++;
    }

    // Create the table view and set its data source to "rowData" array  
    var tableView = Titanium.UI.createTableView( { data : rowData,             style:Titanium.UI.iPhone.TableViewStyle.GROUPED, backgroundColor:'transparent' } );  




    // create table view event listener
tableView.addEventListener('click', function(e)
{
if (e.rowData.test)
{
    var win = Titanium.UI.createWindow({
        url:e.rowData.test,
        title:e.rowData.title
    });

    win.pavilion_id = e.rowData.pav_id;

    if (e.rowData.barColor)
    {
        win.barColor = e.rowData.barColor;
    }
    if (e.rowData.title_image)
    {
        win.titleImage = e.rowData.title_image;
    }
    Titanium.UI.currentTab.open(win,{animated:true});
}
});




    //Add the table view to the window  
    win.add(tableView);
};  

// Send the HTTP request  
loader.send();
}


Ti.UI.currentWindow.addEventListener('focus', function() {
var api_stuff = '*';
api_load(api_stuff);
});




// title control
var tb4 = Titanium.UI.createTabbedBar({
labels:['All', 'Week 1', 'Week 2'],
index:0,
backgroundColor:'#336699',
style:Titanium.UI.iPhone.SystemButtonStyle.BAR
});
win.setTitleControl(tb4);


//THIS SWITCHES TABS FOR WHICHEVER WEEK
tb4.addEventListener('click', function(e)
{
var actual_pav = '*';
if (e.index != 0) {
    actual_pav = e.index; //+ 1; //l.text = 'You clicked index = ' + e.index;
}

api_load(actual_pav);
});

非常感谢你的帮助！我真的被卡住了。

Answer 1

您正在xhr的onload事件中创建并添加表。这意味着每个呼叫都有一个新表。 首先创建一个空表，将其添加到窗口，然后在onload中只使用setData（rowData）。