autoHeight feature

[Pitivier]

Hello,

I'm trying to migrate to extJS 4 an application writen with extJS 3.3 and I can't find how to replace the autoHeight config option of the Panel. What is the correct way to automaticaly resize a Panel with extJS 4 when the browser is resized ?

thanks a lot.

[stevil]

have you tried putting layout: 'fit' on the container of the panel?

[Pitivier]

Yes I have tried this layout but it doesn't work like I want.

Here is my code :

    var previewPanel = new Ext.Panel({
        title: 'Aperçu',
        id: 'preview-panel',
        renderTo: 'apercu',
        width: '100%',
        layout: {
            type: 'fit'
        },
        //height: 500,
        autoHeight: true,
        collapsible: false,
        items: [{
            xtype: 'box',
            id: 'div-cadre-apercu',
            autoEl: {
                id: 'apercu',
                tag:"img",
                src: "apercu" + action + "?timestamp=" + (new Date().getTime()),
                border: "0",
                height: "100%"
            }
        }]
    });

It loads an image in a panel. The problem is I dont know the size of the image. With ExtJS 3.3 the autoHeight config option is perfect. The panel adjust automaticaly its size to the image. With ExtJS 4, this option is gone and I don't know how to do the same thing. I have the same problem with A GridPanel wich I want to be automatically resized when I resize the browser window.

[Justin Noel]

Perhaps the align setting will help? I'm not sure, but it's worth a try.

	layout: {
        type: 'fit',
        align: 'stretch'
    }

[stevil]

Perhaps the align setting will help? I'm not sure, but it's worth a try.

	layout: {
        type: 'fit',
        align: 'stretch'
    }

I think the align: 'stretch' option only works with box layouts. Which is an interesting choice - could you do as Justin suggests, but make the layout 'hbox', and then flex: 1 on the child panel config?

stevil

[Pitivier]

It doesn't work. Only the title bar of the panel is visible.

[stevil]

I do know one thing, and that seems true in 4.0 - it's definitely easier to size child to parent than parent to child. I'm going to have to think about this more, because my inclination would be to say, "detect the rendering of the child, then size the Panel on your own", but that's unclean, and may indicate there's something I'm not considering in the framework.

stevil

[cmeans]

I'd really like to get these properties/features back too. I have a window who's size has to be able to expand/contract depending upon whether the user expands/contracts a panel. Obviously, there are programmatic ways to accomplish this, but the autoHeight feature took care of this for me automatically, so upgrading to ExtJS4 has become much more problematic.

[spidermanit]

Hi All, so what is the final solution for did? I got the same problem. Any tips please.

[spidermanit]

Hi All, so what is the final solution? I got the same problem, did you fix it Pitivier?