PDA

View Full Version : Collapse tool placement on collapsed panel headers with icon



jasewell
20 Jan 2014, 8:42 AM
Sample code:


Ext.create('Ext.panel.Panel', {
title: 'Outer',
width: 600,
height: 200,
layout: 'border',
renderTo: Ext.getBody(),
items: [{
xtype: 'panel',
region: 'west',
//iconCls: 'icon-class',
//icon: 'http://www.sencha.com/forum/images/smilies/1.gif',
collapsible: true,
collapsed: true,
title: 'Inner West',
flex: 1
},{
xtype: 'panel',
region: 'center',
title: 'Inner Center',
flex: 2
}]
});



In either ExtJS 4.1.3 or ExtJS 4.2.1, when the Inner West panel has no icon or iconCls set, the collapse tool appears at the top of the collapsed placeholder header, just above the title, like this:
47642
In ExtJS 4.1.3, when either icon or iconCls is set on the Inner West panel, the collapse tool still appears at the top of the collapsed placeholder header, just above the specified icon, like this:
47643
In ExtJS 4.2.1, when either icon or iconCls is set on the Inner West panel, the collapse tool appears at the very bottom of the collapsed placeholder header, like this:
47644
Is this a bug or a feature? And is there an option that can be set to have 4.2.1 behave like 4.1.3 (put the collapse tool at the top of the collapsed placeholder header)?

Malte123
20 Jan 2014, 4:12 PM
try it with http://docs-origin.sencha.com/extjs/4.2.1/#!/api/Ext.AbstractComponent-cfg-style


stype: {marginTop: '10px'} // for example - maybe it works

jasewell
27 Jan 2014, 12:51 PM
try it with http://docs-origin.sencha.com/extjs/4.2.1/#!/api/Ext.AbstractComponent-cfg-style


style: {marginTop: '10px'} // for example - maybe it works

(edited for spelling and swapped php tags for code tags)
This did not produce the desired behavior.

Martin Schlesier
1 Sep 2016, 2:10 AM
I have the same problem now. When the panel collapsed to the right, the icon is on bottom.
But when it collapsed to the left the it is on top over the label.

Any solution?