整个Ext JS网格需要调整大小以适应内容

Question

要求是，网格的内容永远不应该被截断。整个网格的大小应满足数据的宽度，可能需要窗口上的水平滚动条。

这可能吗？

Ext JS 4.2

Answer 1

这是我的最终解决方案：

Ext.define('App.view.patient.MyPanel', {
    autoScroll : true,
    columnLines : true,
    extend : 'App.grid.Panel',
    width : 500,
    height : 500,
    store : 'App.store.MyPanel',

    initComponent : function() {

        // [...]

        // After store data is loaded, resize columns to fit contents
        var store = Ext.data.StoreManager.lookup(me.store);
        store.on('load', function(store, records, options) {
            Ext.each(me.columns, function(column) {

                // Resize to contents and get new width
                column.autoSize();
                var width = column.getWidth();

                // The autoSize doesn't take config option "columnLines: true"
                // into consideration so buffer it. Bug described here:
                // http://www.sencha.com/forum/showthread.php?264068
                width = width + 3;

                // No need to go too crazy
                width = Math.min(width, 400);

                column.setWidth(width);
            });
        });

        me.callParent(arguments);
    }
});