2013-01-14 71 views
1

我有一個帶有hbox佈局的容器。有了一個按鈕,我添加了一個帶有按鈕的容器,問題是,內容永遠不會到第二行,只能保留在第一行。主容器有一個固定的寬度,並在窗戶內。我該如何做這項工作?我希望它能夠像CSS中的'訣竅'一樣工作。謝謝你的幫助。向extjs中的容器添加動態項目

screenshoot:http://www.ohecollegeplanner.com/cp/img.png

getSelectedItemsCmp: function() { 
    var items = []; 

    var container = Ext.create("Ext.container.Container", { 
     layout: "hbox", 
     align: 'stretch', 
     id: "tagContainer", 
     height: 70, 
     //flex:2,![enter image description here][1] 
     overflowY: "auto", 
     width: "400px", 
     padding: 5 
    }); 

    for (var i = 0; i < this.selectedItems.length; i++) { 
     var tag = this.createSelectedItemsTag(this.selectedItems[i]); 
     container.add(tag); 

    } 

    //container.doLayout(); 

    return container; 
}, 
createSelectedItemsTag: function (obj) { 
    var tag = { 
     xtype: "container", 
     id: "tag_" + obj.value, 
     cls: "tagCompContainer", 
     layout: { 
      type: "hbox" 
     }, 
     items: [{ 
      xtype: "label", 
      text: obj.label, 
      cls: "labelSelectedComps" 
     }, { 
      xtype: "button", 
      text: "x", 
      id: "tagbutton_" + obj.value, 
      listeners: { 
       click: { 
        fn: this.onDeleteSelectedCmpClick, 
        scope: this 
       } 
      } 
     } 

     ] 
    }; 
    return tag; 
}, 
+0

你可以發佈一些代碼和截圖嗎? – Chris

+0

好的這裏是代碼和圖像鏈接...謝謝你的幫助 – user1698738

回答

2

你所得到的是橫向盒不正是......它分配水平容器的項目。也許嘗試使用表格佈局?