PDA

View Full Version : Window not resizing when i resize browser



mk.ranjan
23 Aug 2012, 12:06 AM
Window is not not resizing when i resize browser. Below is my code:

Ext.define("ViewPdfWindow", { extend: 'Ext.window.Window',
alias: 'widget.viewPdfWindow',
config: {
contents: null
},
layout : 'fit',
frame:true,
height:Ext.getBody().getViewSize().height,
width:Ext.getBody().getViewSize().width,
modal:true,
bodyStyle:'margin:5px 200px 0 auto; background: #FFFFFF',
items: {
xtype: 'component',
autoEl: {
tag: 'iframe',
style: 'height: 100%; width: 100%; border: none;margin-left: 100px;',
src: 'data/exmp.pdf'
}
},




});


plz let me what wrong am doing here

sword-it
23 Aug 2012, 12:21 AM
Hi ranjan,



height:Ext.getBody().getViewSize().height,


This will work first time when your window render on Browser body, after browser resize it will not work.
If you want to do with Browser resizing, put your window under viewport container.
For more information read API - http://docs.sencha.com/ext-js/4-1/#!/api/Ext.container.Viewport

vietits
23 Aug 2012, 12:23 AM
You have define fixed height and width when you define ViewPdfWindow class so all the windows created from this class will have the same size. Below is solution to fix this problem. Each time you create window, it will get the size of browser size.


Ext.define("ViewPdfWindow", {
extend: 'Ext.window.Window',
alias: 'widget.viewPdfWindow',
config: {
contents: null
},
layout : 'fit',
frame:true,
// height:Ext.getBody().getViewSize().height,
// width:Ext.getBody().getViewSize().width,
initComponent: function(){
var me = this;
var viewSize = Ext.getBody().getViewSize();
me.height = viewSize.height;
me.width = viewSize.width;
me.callParent(arguments);
},
modal:true,
bodyStyle:'margin:5px 200px 0 auto; background: #FFFFFF',
items: {
xtype: 'component',
autoEl: {
tag: 'iframe',
style: 'height: 100%; width: 100%; border: none;margin-left: 100px;',
src: 'data/exmp.pdf'
}
}
});

mk.ranjan
23 Aug 2012, 12:52 AM
Thanks, this will do