appcelerator의 테이블 뷰 축소 방법

Question

appcelerator 애플리케이션에 확장 가능한 TableView를 삽입하려고합니다. 그래서 나는이 코드를 찾을 수 있습니다

var FoodBank = []; 


function Food(head, backgroundColor, parentIndex, expand, childs){//Food object 
    this.title =     head; 
    this.backgroundColor =   backgroundColor; 
    this.parentIndex =    parentIndex; 
    this.expand =     expand; 
    this.childs =     childs; 
    this.rightImage =    "/images/rowArrowRight.png"; 
} 

function EmptyRow(){//EmptyRow object 
    this.backgroundColor = "green";//change this to transparent to make the rows invisible 
    this.selectedBackgroundColor = "transparent"; 
    this.ignore = true; 
} 

var fruit = new Food("Fruit", "transparent", 0, true, [ 
    {name:"Apple"}, 
    {name:"Mango",}, 
    {name:"Banana"}, 
    {name:"Orange"}] 
); 

var vegetable = new Food("Vegetable", "transparent", 1, true, [ 
    {name:"Carrot"}, 
    {name:"Potatoe"}, 
    {name:"Bringal"}, 
    {name:"Cabbage"}] 
); 

FoodBank.push(fruit); 
FoodBank.push(vegetable); 

for(var i = 0; i <= 4; i++)//add EmptyRow objects to the FoodBank. It needs 5 EmptyRow objects to escape the ugly animation which you get with too few tableViewRows 
    FoodBank.push(new EmptyRow());//this also bypasses the no row found error 

var table = Ti.UI.createTableView({ 
    data:     FoodBank, 
    height:     Ti.UI.FILL, 
    layout:     "vertical", 
    separatorColor:   "transparent", 
    backgroundColor:  "transparent" 
}); 

/** 
    * Event listener on table which handles the expanding/ collapsing of the childs. 
    * Parsing to int because the event callback is String. Int is needed to define next row index in insertRowAfter(); 
    * Also handles child clicks. 
    */ 
table.addEventListener("click", function(e){ 
    if(e.rowData.ignore){//empty row click 
     console.log("Ignored"); 
     return;//do nothing 
    } 
    var index = parseInt(e.index);//e callback is String, parse to int   
    var tableItem = e.rowData;//get table data  
    var parentIndex = parseInt(tableItem.parentIndex);//get parent index and parse to int 
    if(!parentIndex && index > 0){//clicked child 
     console.log("You've clicked child " + index); 
     return; 
    } 
    if(tableItem.expand){//if expand is true expand the elements 
     tableItem.expand = false;//will collapse on next click  
     tableItem.rightImage = "/images/rowArrowDown.png"; 
     for(var i in tableItem.childs){//loop through childs 
      var child = tableItem.childs[i];//fetch child 
      var row = Ti.UI.createTableViewRow({ 
       layout:    "vertical", 
       height:    44, 
       backgroundColor:  "pink" 
      }); 
      var label = Ti.UI.createLabel({ 
       text:     child.name,//set name 
       height:    Ti.UI.SIZE, 
       color:    "red", 
       font:     { 
             fontWeight:"bold", 
            } 
      });    
      row.add(label);  
      table.insertRowAfter(parseInt(i) + index, row); 
     }   
     console.log("Expanded parent " + index); 
    }else if(!tableItem.expand){//if expand is false collapse the elements 
     tableItem.expand = true;//will expand on next click 
     tableItem.rightImage = "/images/rowArrowRight.png"; 
     for(var i in tableItem.childs)//loop through childs 
      table.deleteRow(index + 1); 
     console.log("Collapsed parent " + index);  
    } 
}); 

$.container.add(table); 

내 응용 프로그램을 실행하려고하면, 나는 두 행을 볼 수 있고 나는이 중 하나를 클릭하려고하면, 내가이 행의 자식을 볼 수 있습니다,이입니다 승인. 그러나 부모 행을 다시 클릭하려고하면 자식은 삭제되지 않지만 코드는 자식을 삽입합니다. 그리고 이것은 올바르지 않습니다.

나는 디버그를 할 수 있고이 행에 :이 행을 클릭하려고하면 실행됩니다

if(tableItem.expand){//if expand is true expand the elements 
     tableItem.expand = false;//will collapse on next click 

후, = 거짓 확장의 가치,하지만, tableItem.expand의 값입니다 참된. 그래서이 행은 축소되지 않고 매번 확장됩니다.

Answer 1

iOS 용 확장 가능 및 접을 수있는 tableview 샘플의 샘플이 있습니다.

var win = Ti.UI.createWindow({}); 
var container = Ti.UI.createView({ 
backgroundColor : "white", 
layout : "vertical" 

}); 

var layout = [{ 
title : "Parent 1", 
isparent : true, 
opened : false, 
sub : [{ 
title : "Child 1" 
}, { 
title : "Child 2" 
}] 
}, { 
title : "Parent 2", 
isparent : true, 
opened : false, 
sub : [{ 
title : "Child 3" 
}, { 
title : "Child 4" 
}] 
}]; 
var tableView = Ti.UI.createTableView({ 
style : Titanium.UI.iPhone.TableViewStyle.GROUPED, 
top : 0, 
height : Ti.Platform.displayCaps.platformHeight, 
data : layout 

}); 

tableView.addEventListener("click", function(e) { 

//이 셀은 부모 셀입니까? 경우 (e.row.isparent) {

//Is it opened? 
if (e.row.opened) { 
    for (var i = e.row.sub.length; i > 0; i = i - 1) { 
     tableView.deleteRow(e.index + i); 
    } 
    e.row.opened = false; 
} else { 
    //Add teh children. 
    var currentIndex = e.index; 
    for (var i = 0; i < e.row.sub.length; i++) { 
     tableView.insertRowAfter(currentIndex, e.row.sub[i]); 
     currentIndex++; 
    } 
    e.row.opened = true; 
} 

}

});

container.add(tableView); 
win.add(container); 
win.open();