fiqs8sjn5by0n

Panel tool alignment, title when collapsed

By jane | January 6, 2009

Hi there,

I added a possibility to configure the tools alignment and collapsed title for Ext.Panel.

See screenshot as attachment.

http://extjs.com/forum/attachment.php?attachmentid=9412&d=1221479331

It allows you to code the following:

var north = new Ext.Panel({
title : 'Navigation',
collapsedTitle : true, //true or string to use as collapsed title
toolAlign : 'left', //Either left or right
tools : [{
id : 'help',
handler : function(evt, toolEl, panel) {
},
scope : north
}, {
id : 'plus',
handler : function(evt, toolEl, panel) {
},
scope : north
}],
region : 'north',
split : true,
width : 200,
collapsible : true,
margins : '3 0 3 3',
cmargins : '3 3 3 3',
html : 'Hello World!'
});

var south = new Ext.Panel({
title : 'South',
collapsedTitle : 'South collapsed.',
region : 'south',
split : true,
width : 200,
collapsible : true,
margins : '3 0 3 3',
cmargins : '3 3 3 3',
html : 'Hello World!'
});
Required css:

.x-layout-collapsed-text{float:left;color:#15428b;font:bold 11px tahoma,arial,verdana,sans-serif;padding:5px 2px 4px 5px;border:0 none;background:transparent;}
.x-panel-header-text{float:left;}
.x-tool-align-left{float:left;}
Required js: (Could be implemented much more straight forward as native part of Ext.)


Ext.Panel.prototype.orgAddTool = Ext.Panel.prototype.addTool;
Ext.Panel.prototype.addTool = function() {
if (!this.toolAlign)
this.toolAlign = "right";
if (!this.toolTemplate) {
var tt = new Ext.Template(' + this.toolAlign + '">




#If you have any other info about this subject , Please add it free.#
Your name:
E-mail:
Telphone:

Your comments:


If you have any other info about Panel tool alignment, title when collapsed , Please add it free.

Topics: enart.xn--fiqs8sjn5by0n.com | edit

Cash Loan: Affable Financial Assistance for Emergencies Learn Spoken English Through the Correct Method