1. #1
    Sencha User
    Join Date
    Jun 2010
    Posts
    139
    Vote Rating
    3
    jeanluca is on a distinguished road

      0  

    Default scroll to position after scrollend

    scroll to position after scrollend


    Hi

    I have a panel wich you can scroll horizontal. So, when you scroll it to the right and release it, the panel moves to it original position. What I'm trying below, is that I don't want it to scroll to its original position, but to some other position. Here is my test code:

    Code:
    Ext.application({
    
        launch: function() {
            var p = Ext.create('Ext.Panel', {
                    fullscreen: true,
                    title: 'Pull to Refresh Demo',
                    layout: 'hbox', 
                    scrollable: {
                            direction: 'horizontal'
                    },      
                    items: [{
                            html: 'First Panel', 
                            style: 'background-color: #5E99CC;'
                            },{
                                    html: 'First Panel',
                            style: 'background-color: #5E99CC;'
                    }]
            });
    
    
            p.getScrollable().getScroller().on({
                    'scrollend':function(){
                            this.minPosition.x = -100 ;
                    },
                    scope: p.getScrollable().getScroller()}
            );
        }
    }) ;
    If I scroll it to the right (far enough) it works, the panel scrolls back and stops 100px from the left.
    If I scroll to the right however, it doesn't work, it scrolls to its original position.

    If I change this value from -100 into 100 I see it moving to its new position, but just after that it jumps back to its original position. I suspect I'm doing something wrong. Any suggestions ?
    Furthermore, where is 'minPosition.x' documented ? (I got it from the PullRefresh plugin)

    Thanks a lot
    Luca

    ps here is my index.html file

    Code:
    <!doctype html>
    <html>
            <head>
                    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
                    <link rel="stylesheet" href="sencha-touch.css" type="text/css">
                    <script type="text/javascript" src="sencha-touch-all-debug.js"></script>
                    <script type="text/javascript" src="app.js"></script>
            </head>
            <body>
            </body>
    </html>

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,330
    Vote Rating
    846
    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


    So you are wanting the scroller to allow you to scroll out of it's bounds?
    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 User
    Join Date
    Jun 2010
    Posts
    139
    Vote Rating
    3
    jeanluca is on a distinguished road

      0  

    Default


    yes! After the component (which is being scrolled with) is released the component returns to its original position. It is this position I would like to change, but I want to do this on a scrollend event (the moment the component is released). Is this possible ?

    cheers

  4. #4
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,330
    Vote Rating
    846
    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


    You can add CSS to move it but the scroller isn't meant to do this.
    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.

  5. #5
    Sencha User
    Join Date
    Jun 2010
    Posts
    139
    Vote Rating
    3
    jeanluca is on a distinguished road

      0  

    Default


    ok, thanks, I'll try that!

Thread Participants: 1