Results 1 to 7 of 7

Thread: [6.7 Modern] Grid scrolling is not smooth and it is jumpy

    Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha User
    Join Date
    Apr 2013
    Posts
    130
    Vote Rating
    14
      1  

    Default [6.7 Modern] Grid scrolling is not smooth and it is jumpy


  2. #2
    Sencha Premium User
    Join Date
    May 2015
    Posts
    163
    Vote Rating
    45
      0  

    Default

    Fine for me in Chrome.

  3. #3
    Sencha User Animal's Avatar
    Join Date
    Mar 2007
    Location
    Bédoin/Nottingham
    Posts
    30,890
    Vote Rating
    90
      0  

    Default

    It was perhaps ill judged to release the 9 billion pixel scroller as the default scroller in grids. I think that's what's doing it.

  4. #4
    Sencha Premium Member EPV's Avatar
    Join Date
    Dec 2010
    Location
    Sweden
    Posts
    361
    Vote Rating
    46
      0  

    Default

    The scrolling is useless in modern on touch device. Can be simulated in Chrome emulating touch device.
    Any updates on bug fix?

    / Emil

  5. #5
    Ext Support Team
    Join Date
    Jan 2018
    Posts
    465
    Vote Rating
    -334
      -1  

    Default

    Hello,

    Thank you for contacting us on Sencha Forums!

    We are unable to reproduce this, we have checked in browser and mobile dev mode in browser as well so request you to provide steps to duplicate this issue and work on a resolution.

    Regards,
    Kumar
    Sencha Support.

  6. #6
    Sencha User
    Join Date
    Apr 2013
    Posts
    130
    Vote Rating
    14
      0  

    Default

    I add an animation to the virtualScroller of infinite list/grid, it's not as smooth as it in 6.6, but it's getting there

    Code:
    Ext.define(null, {
        override: 'Ext.scroll.VirtualScroller',
        
        privates: {
            onWheel: function(e) {
                var me = this,
                    self = me.self,
                    deltaX = e.deltaX,
                    deltaY = e.deltaY,
                    position = me.position,
                    oldX = position.x,
                    oldY = position.y,
                    x = me.constrainX(position.x + deltaX),
                    y = me.constrainY(position.y + deltaY);
                    
                console.log(deltaY);
                if (x !== oldX || y !== oldY) {
                    me.isWheeling = self.isWheeling = true;
                    me.doScrollTo(x, y, { easing: 'ease-out', duration: 150 }); // animation
                    e.preventDefault();
                } else if (me.isScrolling) {
                    me.onScrollEnd();
                }
            }
        }
    });
    Fiddle:
    https://fiddle.sencha.com/#view/editor&fiddle/2sks

  7. #7
    Sencha User
    Join Date
    Apr 2013
    Posts
    130
    Vote Rating
    14
      0  

    Default

    Better solution:

    Css below is all we need:

    Code:
    .x-virtualscroller .x-scroller-inner {
        transition: transform 0.15s ease-out 0s;
    }

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
  •