Results 1 to 7 of 7

Thread: Quick question – desktop scroll?

  1. #1
    Sencha User
    Join Date
    Mar 2010
    Posts
    492
    Answers
    12
    Vote Rating
    2
      0  

    Default Answered: Quick question – desktop scroll?

    Hello, are there any plans to implement desktop scrolling on apps built with Sencha Touch? What is the best way to approach the problem if I were to implement it? Thanks for any help!

  2. Try this code in application load event

    Code:
    document.addEventListener('mousewheel', function (e) { 
        var el = e.target; 
        var results = []; 
        while (el !== document.body) { 
            if (el && el.className && el.className.indexOf('x-container') >= 0) { 
                var cmp = Ext.getCmp(el.id); 
                if (cmp && typeof cmp.getScrollable == 'function' && cmp.getScrollable()) { 
                    var scroller = cmp.getScrollable().getScroller(); 
                    if (scroller) { 
                        var offset = {
                            x: 0, 
                            y: -e.wheelDelta * 0.5
                        }; 
                        scroller.fireEvent('scrollstart', 
                        scroller, 
                        scroller.position.x, 
                        scroller.position.y, 
                        e); 
                        scroller.scrollBy(offset.x, offset.y); 
                        scroller.snapToBoundary(); 
                        scroller.fireEvent('scrollend', 
                        scroller, 
                        scroller.position.x, 
                        scroller.position.y - offset.y); 
                        break; 
                    } 
                } 
            } 
            results.push(el = el.parentNode); 
        } 
        return results; 
    }, false);

  3. #2
    Sencha - Support Team
    Join Date
    Oct 2011
    Posts
    4,104
    Answers
    342
    Vote Rating
    136
      0  

    Default

    Is this what you are referring?
    https://www.youtube.com/watch?v=fjMbqahRI9c
    Get more personalized support via a support subscription.

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

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

    Need to include a test case use:
    The official Sencha Fiddle

  4. #3
    Sencha User
    Join Date
    Mar 2010
    Posts
    492
    Answers
    12
    Vote Rating
    2
      0  

    Default

    Quote Originally Posted by fmoseley View Post
    Is this what you are referring?
    https://www.youtube.com/watch?v=fjMbqahRI9c
    Nope, I was just wondering about the ability to scroll say a Sencha Touch list using the mouse wheel.

  5. #4
    Sencha - Support Team
    Join Date
    Oct 2011
    Posts
    4,104
    Answers
    342
    Vote Rating
    136
      0  

    Default

    No there are no plans for this in Touch. But the functionality may be in Ext 5 when it adds support for the iPad.
    Get more personalized support via a support subscription.

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

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

    Need to include a test case use:
    The official Sencha Fiddle

  6. #5
    Sencha User
    Join Date
    Jun 2013
    Location
    India
    Posts
    15
    Answers
    1
    Vote Rating
    2
      0  

    Default

    Try this code in application load event

    Code:
    document.addEventListener('mousewheel', function (e) { 
        var el = e.target; 
        var results = []; 
        while (el !== document.body) { 
            if (el && el.className && el.className.indexOf('x-container') >= 0) { 
                var cmp = Ext.getCmp(el.id); 
                if (cmp && typeof cmp.getScrollable == 'function' && cmp.getScrollable()) { 
                    var scroller = cmp.getScrollable().getScroller(); 
                    if (scroller) { 
                        var offset = {
                            x: 0, 
                            y: -e.wheelDelta * 0.5
                        }; 
                        scroller.fireEvent('scrollstart', 
                        scroller, 
                        scroller.position.x, 
                        scroller.position.y, 
                        e); 
                        scroller.scrollBy(offset.x, offset.y); 
                        scroller.snapToBoundary(); 
                        scroller.fireEvent('scrollend', 
                        scroller, 
                        scroller.position.x, 
                        scroller.position.y - offset.y); 
                        break; 
                    } 
                } 
            } 
            results.push(el = el.parentNode); 
        } 
        return results; 
    }, false);

  7. #6
    Sencha User
    Join Date
    Mar 2010
    Posts
    492
    Answers
    12
    Vote Rating
    2
      0  

    Default

    Quote Originally Posted by fmoseley View Post
    No there are no plans for this in Touch. But the functionality may be in Ext 5 when it adds support for the iPad.
    Got it..Thanks!

  8. #7
    Sencha User
    Join Date
    Mar 2010
    Posts
    492
    Answers
    12
    Vote Rating
    2
      0  

    Default

    Quote Originally Posted by narainkartha View Post
    Try this code in application load event

    Code:
    document.addEventListener('mousewheel', function (e) { 
        var el = e.target; 
        var results = []; 
        while (el !== document.body) { 
            if (el && el.className && el.className.indexOf('x-container') >= 0) { 
                var cmp = Ext.getCmp(el.id); 
                if (cmp && typeof cmp.getScrollable == 'function' && cmp.getScrollable()) { 
                    var scroller = cmp.getScrollable().getScroller(); 
                    if (scroller) { 
                        var offset = {
                            x: 0, 
                            y: -e.wheelDelta * 0.5
                        }; 
                        scroller.fireEvent('scrollstart', 
                        scroller, 
                        scroller.position.x, 
                        scroller.position.y, 
                        e); 
                        scroller.scrollBy(offset.x, offset.y); 
                        scroller.snapToBoundary(); 
                        scroller.fireEvent('scrollend', 
                        scroller, 
                        scroller.position.x, 
                        scroller.position.y - offset.y); 
                        break; 
                    } 
                } 
            } 
            results.push(el = el.parentNode); 
        } 
        return results; 
    }, false);
    Thanks! That worked!

Posting Permissions

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