Results 1 to 5 of 5

Thread: BorderLayout with autoScroll

  1. #1
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,791
    Vote Rating
    392
      0  

    Default BorderLayout with autoScroll

    A change in behaviour from 4.0.7 to 4.1.0-beta-1, albeit using a slightly odd combination of layout options.

    The following code has a vertical scrollbar in 4.1.0-beta-1, it didn't previously. The scrollbar is disabled and over the top of my panel contents. Arguably autoScroll: true doesn't make sense in this case; in my original code that setting is inherited from a superclass.

    Code:
    Ext.create('Ext.panel.Panel', {
        autoScroll: true,
        height: 400,
        layout: 'border',
        renderTo: Ext.getBody(),
        title: 'Outer',
        width: 400,
        items: [
            {
                region: 'west',
                title: 'West',
                width: 200
            }, {
                region: 'center',
                title: 'Center'
            }
        ]
    });

  2. #2
    Sencha User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,029
    Vote Rating
    1367
      0  

    Default

    What browser you seeing this? I'm not seeing this in Chrome 16 and FF9.
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Frontend Engineer
    ________________
    Need any sort of Ext JS help? Modus Create is here to help!

    Check out my GitHub:
    https://github.com/mitchellsimoens

  3. #3
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,791
    Vote Rating
    392
      0  

    Default

    Now you mention it, it does seem to be browser-specific.

    I could reproduce it using Chrome 16 (Windows and Ubuntu) and Safari 5.1 (Windows). Non-Webkit browsers were all fine.

    Not sure what could account for it not happening for you in Chrome. I tried varying the doctype but it happened no matter what I tried.

  4. #4
    Sencha User dongryphon's Avatar
    Join Date
    Jul 2009
    Location
    Kansas
    Posts
    1,740
    Vote Rating
    259
      0  

    Default

    I can reproduce it on Chrome 14. It appears to be a bug in Chrome because if I do this:

    PHP Code:
    Ext.fly('panel-1001-body').setStyle('overflow''hidden');

    setTimeout(function () {
        
    Ext.fly('panel-1001-body').setStyle('overflow''auto');
    }, 
    0); 
    In the debugger, the scrollbar goes away. So, I tried this and it also seems to correct the behavior:

    PHP Code:
        Ext.create('Ext.panel.Panel', {
            
    autoScrolltrue,
            
    height400,
            
    layout'border',
            
    renderToExt.getBody(),
            
    title'Outer',
            
    width400,
            
    listeners: {
                
    resize: function (panel) {
                    
    panel.body.setStyle('overflow''hidden');
                    
    setTimeout(function () {
                        
    panel.body.setStyle('overflow''auto');
                    }, 
    0);
                }
            },
            
    items: [
                {
                    
    region'west',
                    
    title'West',
                    
    width200
                
    }, {
                    
    region'center',
                    
    title'Center'
                
    }
            ]
        }); 
    Very strange. I've never seen this in other places. Have you?
    Don Griffin

    "Use the source, Luke!"

  5. #5
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,791
    Vote Rating
    392
      0  

    Default

    I don't recall having seen this problem before. I only got it in one place and it's easy enough for me to turn off autoScroll. I'm not worried about my own app, more concerned it may be the tip of an iceberg lurking somewhere in the 4.1 layouts.

    Another variation on the theme you tried...

    If you set the panel body overflow to scroll you'll get scrollbars, as expected. If you then set it back to auto they'll stick around. If instead you go to hidden then auto you don't get scrollbars. It's the classic UI problem of needing scrollbars because you have scrollbars.

    The original issue is more mysterious though. I haven't been able to induce that unneeded scrollbar via console styling hackery yet.

Posting Permissions

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