PDA

View Full Version : How to minimize Ext Window



atul.sachan@capgemini.com
12 Apr 2012, 4:44 AM
I am opening Ext.window as a popup and trying to minimize but minimize button is not working.
-------------
Ext.define('com.gm.vl.view.reports.CustomerReportView', {
extend: 'Ext.window.Window',
alias : 'widget.CustomerReport',
height: 560,
width : 990,
minimizable :true,
maximizable: true,
id:'custreport',
//autoScroll:true,
listeners: {
minimize: function(win,obj) {


}
},
---------------------------------
any thoughts on this ??? please

Thanks

friend
12 Apr 2012, 6:50 AM
From the API Documentation for Ext.window.Window:



True to display the 'minimize' tool button and allow the user to minimize the window, false to hide the button and disallow minimizing the window. Note that this button provides no implementation -- the behavior of minimizing a window is implementation-specific, so the minimize event must be handled and a custom minimize behavior implemented for this option to be useful.

atul.sachan@capgemini.com
13 Apr 2012, 1:30 AM
I have read this already, could you provide any sample code for minimizing the window.
Tried this code but not working on click of minimize button because 'minimize' event occurs after window has been minimized.
//////////////////
listeners: {
minimize: function(win,obj) {
win.minimize (http://docs.sencha.com/ext-js/4-0/#!/api/Ext.window.Window-method-minimize)( )
}
//////////////

friend
13 Apr 2012, 5:51 AM
Calling win.minimize() inside the minimize event simply fires the minimize event again, where you may be causing event recursion...

From the API docs for the Window.minimize() function:



Placeholder method for minimizing the window. By default, this method simply fires the minimize event since the behavior of minimizing a window is application-specific. To implement custom minimize behavior, either the minimize event can be handled or this method can be overridden.


It's up to you to decide what a 'minimize' event means in terms of your window and supply the code accordingly.

Do you want a small icon to appear near the bottom right corner of a panel, to indicate a 'minimized' window? If so, then you have to code that...

atul.sachan@capgemini.com
15 Apr 2012, 9:50 PM
Simply i wanted to minimize the Window on click of minimize button. Could you provide any sample code?

evant
15 Apr 2012, 10:03 PM
What the docs are saying is that "minimize" doesn't ~mean~ anything. For example, in Windows you have a taskbar, so "minimize" means send the item to the taskbar. In the case of your application, that behaviour may not make sense, so you need to implement whatever minimize means for your application.

atul.sachan@capgemini.com
16 Apr 2012, 5:25 AM
This is my window, but minimize is not working here, if i am doing any thing wrong here then please let me know.
//////////////////////////////////////////////////////
Ext.define('com.gm.vl.view.reports.CustomerReportView', {
extend: 'Ext.window.Window',
alias : 'widget.CustomerReport',
height: 560,
width : 990,
minimizable :true,
maximizable: true,
id:'custreport',
//autoScroll:true,
listeners: {
minimize: function(win,obj) {



}
},
initComponent: function() {
var me = this;
Ext.applyIf(me, {
items: [

{xtype: 'panel',
border : 0,

items: [
{
xtype : 'panel',
// width : 940,
html : '<span class='+styleData.whiteLabel+' style="margin-left:850px;valign : "middle"> <a href="http://10.156.1.87:7003/vl_web/VehicleReportPDF?View='+ Ext.getCmp('viewID').getValue()+'" onclick="window.open(this.href,width=1000,height=1000);return false;" target="target"> <img src="images/PrintIconNew.jpg"> </img> </a> <img src="images/Help.gif"></img></span>',
bodyStyle : {background: '#003366'},
border : 0,
height : 30,
style : {
marginTop :'5px',
marginBottom :'10px',
marginLeft :'10px',
background : '#003366'
}
}]
},
{
xtype: 'panel',
border : 0,
height : 50,
layout: {
type: 'column'
},
items: [

{ xtype: 'combobox',
width: 160,
store: 'DViewTypeStore',
displayField: 'name',
valueField: 'value',
editable : false,
value : 'Detail',
mode : 'local',
fieldLabel:'Report type',
action :'summarydetail',
labelWidth :70,
style : {
marginLeft : '645px'
}
},

{ xtype: 'combobox',
width: 160,
store: 'DealerDataStore',
displayField: 'name',
valueField: 'value',
editable : false,
value : 'Customer',
mode : 'local',
fieldLabel:'Report for',
action :'summarydetail',
labelWidth :70,
style : {
marginLeft : '10px'
}
}
]},

{}
]
});


me.callParent(arguments);
},
minimize: function() {
this.fireEvent('minimize', this);
return this;
}
});
////////////////

Thanks

veladitya
9 Nov 2012, 1:17 PM
am also looking for the same kind of requirement,.... can anyone...help me out....

evant
9 Nov 2012, 3:19 PM
Please read what I wrote above. You need to implement minimize behaviour.

Assume you have a normal webpage. What does it mean to "minimize" a window?

suzuki1100nz
9 Nov 2012, 5:49 PM
What do YOU want to happen with a window minimize?
There is no task bar to put the window in as your app is running in a browser whatever you decide for your application you have to code the behavior Sencha cant do that for you.

An idea is a simple task bar rip off - Have a toolbar at the bottom or your app, when a window is minimized place a proxy button into the toolbar with the name of the window.
When a user clicks on the button re open the window and remove the button.

veladitya
12 Nov 2012, 9:28 AM
thank you all.....am able to implement.