1

我有一个带有 hbox 布局的容器。使用一个按钮,我正在添加另一个容器,里面有一个按钮,问题是内容永远不会进入第二行,只停留在第一行。主容器具有固定宽度,并且位于窗口内。我怎样才能使这项工作?我希望它像 CSS 中的“break-word”一样工作。谢谢你的帮助。

截图: 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;
},
4

1 回答 1

2

你得到的正是 hbox 所做的......它水平分布容器的项目。也许尝试使用表格布局?

于 2013-01-14T14:58:40.420 回答