ExtJS CheckboxGroup标签包装

时间:2013-01-29 15:13:15

标签: extjs

我的复选框有问题。因此,这些复选框位于列中,较长的标签位于其复选框下。是否有任何溶剂将色谱柱宽度设置为最长的标签?它必须是动态宽度。你能救我吗?

1 个答案:

答案 0 :(得分:2)

您可以使用以下内容来衡量所有标签,并将最宽的标签的宽度应用于所有标签http://jsfiddle.net/Wr7Wr/1/

Ext.define('DynamicLabelFormPanel', {
    extend: 'Ext.form.Panel',

    initComponent: function() {
        // Need to create a hidden field to measure the text
        var field = new Ext.form.field.Text({fieldLabel: 'Testing', value: 'whateves', renderTo: Ext.getBody(), hidden: true});
        var metrics = new Ext.util.TextMetrics(field.labelEl);
        var widths = Ext.Array.map(this.items, function(item) {
            // Need to acount for the : 
            return metrics.getWidth(item.fieldLabel + ":");
        });
        var maxWidth = Math.max.apply(Math, widths);
        for (var i = 0; i < this.items.length; i++) {
            this.items[i].labelWidth = maxWidth;
        }
        this.callParent();
    }
}

作为一个插件,这可能会更好,但它会告诉你需要做什么