2017-04-12 1 views
0

접을 수있는 컨테이너 목록을 만들려고합니다. 컨테이너가 붕괴되고 팽창해야합니다. 예제 목록 항목 렌더러를 만들었습니다.모바일 목록 접을 수있는 항목

qx.Class.define("mb.ui.list.QuotaWeekListRenderer", 
{ 
    extend : qx.ui.mobile.list.renderer.Default, 

    members : 
    { 
    __collapsible : null, 
    __weeksContainer : null, 

    _init : function() 
    { 
     this.ignoreBase; 

     this.__collapsible = this._createCollapsible(); 

     this.add(this.__collapsible); 
    }, 

    setTitle : function(title) 
    { 
     this.ignoreBase; 

     if (title && title.translate) 
     { 
     this.__collapsible.setTitle(title.translate()); 
     } 
     else 
     { 
     this.__collapsible.setTitle(title); 
     } 
    }, 

    addWeek : function(value) 
    { 
     var label = new qx.ui.mobile.basic.Label(value); 
     this.__collapsible.add(label); 
    }, 

    _createCollapsible : function() 
    { 
     return new qx.ui.mobile.container.Collapsible(); 
    }, 

    // overridden 
    reset : function() 
    { 
     this.ignoreBase; 

     this.setTitle(""); 
     this.__collapsible.getContent().removeAll(); 
    } 
    } 
}); 

var page = new qx.ui.mobile.page.NavigationPage(); 
page.setTitle("List"); 
page.addListener("initialize", function() 
{ 

    // List creation 
    var list = new qx.ui.mobile.list.List({ 
    configureItem : function(item, data, row) 
     { 
     item.setTitle("Week " + parseInt(data.weekNo)); 
     for (var i = 0, l = data.weekDates.length; i < l; i++) 
     { 
      item.addWeek(data.weekDates[i]); 
     } 
     }, 
     createItemRenderer : function() 
     { 
     return new mb.ui.list.QuotaWeekListRenderer(); 
     }  
    }); 

    // Create the data 
    var data = [{title: "title1", weekNo: 1, weekDates : ["1/2/2014", "2/2/2014"]}, 
       {title: "title2", weekNo : 2, weekDates : ["2/3/2015", "9/3/2015"]}]; 


    list.setModel(new qx.data.Array(data)); 

    page.getContent().add(list); 
},this); 

this.getManager().addDetail(page); 

page.show(); 

는 위의 내 문제는 항목을 '탭'을 확장하지 않는다는 것입니다 Playground

에서 실행할 수 있습니다. 리스너는 컨테이너의 "축소 된"속성을 토글하지만 DOM 요소에는 영향을주지 않습니다. 어떤 아이디어로 그것을 고치는 법?

답변

1

이와 비슷한 내용일까요?

Playground example

+0

감사합니다. 당신이 만든 것은 두 개의 접을 수있는 컨테이너에있는 두 개의 목록입니다. 축소 가능한 컨테이너 목록을 항목으로 하나 필요합니다. 목록 제공자가 요소를 복제 한 것을 이해합니다. 결과적으로 탭 리스너의 대상에서 축소 된 것으로 표시되지만 페이지의 요소는 축소됩니다. Listener를 사용하는 모든 작업은 항목에서 수행되며 실제로는 탭하는 목록 항목에는 영향을주지 않습니다. – Kama

관련 문제