1. #1
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,590
    Vote Rating
    322
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      0  

    Default BorderLayout with autoScroll

    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 - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,824
    Vote Rating
    836
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    What browser you seeing this? I'm not seeing this in Chrome 16 and FF9.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,590
    Vote Rating
    322
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      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 - Ext JS Dev Team dongryphon's Avatar
    Join Date
    Jul 2009
    Posts
    1,341
    Vote Rating
    132
    dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all

      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
    Ext JS Development Team Lead

    Check the docs. Learn how to (properly) report a framework issue and a Sencha Cmd issue

    "Use the source, Luke!"

  5. #5
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,590
    Vote Rating
    322
    skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future skirtle has a brilliant future

      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.

Thread Participants: 2