Results 1 to 3 of 3

Thread: Window maximize problem when constrained to BorderLayout center region

  1. #1
    Ext JS Premium Member
    Join Date
    Aug 2010
    Posts
    63

    Default Window maximize problem when constrained to BorderLayout center region

    Hi folks,

    I have a situation where I want to constrain a window to the center region of a BorderLayout. This of course works fine, however, when I click the maximize button, the bottom docked toolbar is getting cut off. If I simply do not constrain the window then this doesn't happen. I'm not sure if I'm missing something obvious or if this might be a bug. This is using version 4.2.1. Here's simplified test code that demonstrates the issue:

    Code:
    <html>
    
      <head>
    
        <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
        <link rel="stylesheet" type="text/css"
          href="js/extjs/resources/css/ext-all.css">
        <script type="text/javascript" src="js/extjs/ext-all.js"></script>
    
        <script>
    
          Ext.onReady(function() {
    
            Ext.create("Ext.container.Viewport",
              { layout : "border",
                items: [
                  { height : 60, region : "north", items: [ ] },
                  { id : "regCenter", region : "center" }
                ]
              }
            );
    
            Ext.create("Ext.window.Window",
              { maximizable : true, width : 350, height : 440,
                constrainHeader : true, constrainTo : "regCenter",
                dockedItems : [
                  { xtype : "toolbar", dock : "bottom",
                    items : [ { text : "XXX" } ]
                  }
                ],
                items : [ ]
              }
            ).show();
    
          });
    
        </script>
    
      </head>
    
      <body></body>
    
    </html>
    I've got it narrowed down to something to do with the constrainTo and constrainHeader... if I remove either or both then maximize works as expected, nothing is cut off on the bottom.

    Thanks in advance for any suggestions,
    Frank

  2. #2
    Sencha User
    Join Date
    Sep 2011
    Posts
    574

    Default

    You should try changing constrainTo to renderTo or add window as child of center region. And read the doc about maximise fitting.

  3. #3
    Ext JS Premium Member
    Join Date
    Aug 2010
    Posts
    63

    Default

    Thanks, making it a child element worked. I've never done windows that way before though, and it's odd to me, but it does indeed work.

    FYI, renderTo didn't work because it had some other nasty side-effects, namely that maximize still didn't work (the bottom of the window wound up 60 pixels from the bottom of the center region, which happens to be the height of the north region, so it seems like the maximize code didn't calculate the height properly) and when you drag the window to the top of the center region and release, it automatically pushes the window down, and again, it's by the height of the north region.

    Given the docs for constrainTo, it looks to me like there's some bugs with regard to it. But, in any case, I'm good to go now, so thanks!

Posting Permissions

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