Results 1 to 3 of 3

Thread: Resize a window using setWidth and setHeight on browser resize

  1. #1
    Sencha User
    Join Date
    Jul 2013
    Posts
    26
    Answers
    2

    Default Resize a window using setWidth and setHeight on browser resize

    Hi,

    I have a window that sizes itself according to the browser width and height.

    I have to resize this rendered window on browser resize as well.

    I have written the following code for that:
    var myDialog = Ext.widget('mydialog');
    myDialog .setHeight(Ext.getBody().getViewSize().height- 100);
    myDialog .setWidth(Ext.getBody().getViewSize().width- 100);
    myDialog .doLayout();

    But not working.Please help.

    Thanks

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,410
    Answers
    716

    Default

    Something like this perhaps?

    Code:
    Ext.application({
        name : 'Fiddle',
    
        launch : function() {
           var winPad = 100,
               win = Ext.create('Ext.window.Window', {
                title: 'Hello',
                height: 200,
                width: 400,
                layout: 'fit',
                items: {
                    xtype: 'grid',
                    border: false,
                    columns: [{
                        header: 'World'
                    }], 
                    store: Ext.create('Ext.data.ArrayStore', {})
                }
            }).show();        
            
            
            Ext.EventManager.onWindowResize(function() {
                win.setX(winPad-(winPad/2));
                win.setWidth(Ext.getBody().getViewSize().width-winPad);
            });
        }
    });

  3. #3
    Sencha User
    Join Date
    Jul 2013
    Posts
    26
    Answers
    2

    Default

    Thanks , got it working.
    In my MVC app, the window is defined as a view, without height and width.
    On window's 'beforerender' event its height and width are set.

    The latter resizing is done in viewport resize event.

    I have a singleton class set for global properties used across my application.
    When the window object is created, I maintain this object as a global property under MyApp.Global.MY_DIALOG ,I change this object's height and width on viewport resize,
    instead of selecting the widget using Ext.widget('mydialog') and setting width and height to it.

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •