PDA

View Full Version : scrollbar, tabpanel and window



gabriele.muscas
9 Oct 2010, 5:54 AM
Hi,
scrollbars in a window are making me crazy.

As you can see in the image, with autoheight=true there are not the scrollbar, without it my panel does not have the correct size.

Here's an example of code that you can easily try.


Ext.ns('Ext.mycompany');
Ext.mycompany.EditPanel=Ext.extend(Ext.form.FormPanel,{
frame:true,
defaults: {
anchor:'100%'
},
autoHeight: true,
defaultType: 'textfield',
autoScroll: true,
initComponent: function(){

Ext.apply(this, {
reader: new Ext.data.JsonReader({
idProperty: 'id',
root: 'items'
}),
items:[
{
xtype:'textfield'
},
{
xtype:'textfield'
},
{
xtype:'textfield'
},
{
xtype:'textfield'
},
{
xtype:'textfield'
},
{
xtype:'textfield'
},
{
xtype:'textarea'
},
{
xtype:'tabpanel',
activeTab: 0,
autoScroll:true,
defaults:{
xtype:'panel',
layout:'form',
frame:true,
autoHeight:true,
autoScroll:true,
defaultType: 'textfield'
},
items:[
{
xtype:'panel',
title:'Tab',
items:[
{
xtype:'fieldset',
items:[
{xtype:'textfield'},
{xtype:'textfield'},
{xtype:'textfield'}
]
},
{
xtype:'fieldset',
items:[
{xtype:'textfield'},
{xtype:'textfield'},
{xtype:'textfield'}
]
},
{
xtype:'fieldset',
items:[
{xtype:'textfield'},
{xtype:'textfield'},
{xtype:'textfield'}
]
}
]
}
]
}
]
});
Ext.mycompany.EditPanel.superclass.initComponent.apply(this, arguments);
}
});

Ext.mycompany.EditWindow=Ext.extend(Ext.Window,{
initComponent: function(){
Ext.apply(this, {
closeAction:'hide',
border: false,
modal:true,
shadow:true,
// layout:'fit',
maximizable: true,
plain: true,
width:800,
height:600,
items:[
new Ext.mycompany.EditPanel()
]
});
Ext.mycompany.EditWindow.superclass.initComponent.apply(this, arguments);
}

});

var win = new Ext.mycompany.EditWindow();I do not understand where I'm wrong.
Does anyone understand this?

Thanks,
Gabriele

(Extjs 3.2.1)

Condor
9 Oct 2010, 5:57 AM
The window should be layout:'fit' and the form should be autoHeight:false.

ps. In initComponent, you should also apply the config to 'this.initialConfig' and not only to 'this'.

gabriele.muscas
9 Oct 2010, 2:09 PM
autoHeight:false im the form...this WORKS!

Thanks!
Now there are too many scrollbar. I think the solutions is to reduce the anchor value.
22765

I try to apply the config to 'this.initialConfig' but it not works.


Where can I find information about it?

Thanks,
Gabriele

Condor
10 Oct 2010, 7:58 AM
anchor:'100%' doesn't account for a vertical scrollbar.

Try using something like anchor:'-20'