ExtJS CheckboxGroup 标签换行

Question

我的复选框有问题。因此，这些复选框位于列中，较长的标签位于其复选框下方。有没有办法将列宽设置为最长标签？它必须是动态宽度。你能帮我吗？

Answer 1

您可以使用以下工具来测量所有标签并将最宽标签的宽度应用于所有标签 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();
    }
}

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