scroll to position after scrollend

**jeanluca** · 29 Apr 2012 3:16 AM

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>

**mitchellsimoens** · 1 May 2012 5:29 AM

So you are wanting the scroller to allow you to scroll out of it's bounds?

**jeanluca** · 1 May 2012 9:12 AM

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

**mitchellsimoens** · 1 May 2012 9:20 AM

You can add CSS to move it but the scroller isn't meant to do this.

**jeanluca** · 1 May 2012 12:12 PM

ok, thanks, I'll try that!

scroll to position after scrollend

Thread Tools

Search Thread

Display

scroll to position after scrollend

scroll to position after scrollend