Dan Polivy created CB-6231:
------------------------------

             Summary: Better approach for preventing rubberband in Windows 
Phone 8
                 Key: CB-6231
                 URL: https://issues.apache.org/jira/browse/CB-6231
             Project: Apache Cordova
          Issue Type: Improvement
          Components: WP8
    Affects Versions: 3.4.0
            Reporter: Dan Polivy
            Assignee: Jesse MacFadyen
            Priority: Minor


I've been looking for a good solution for the "DisallowOverscroll" setting that 
works on Windows Phone 8; I've tried the 
{{this.CordovaView.DisableBouncyScrolling}} setting, but it has the side effect 
of making "intended" scrolling feel really sluggish, because it only responds 
to swipes and doesn't track real-time under one's finger.

Using [this 
approach|http://stackoverflow.com/questions/21652548/bouncing-when-overflow-set-to-auto-or-scroll-in-wp8-webbrowser-control],
 I came up with an alternate implementation that works in the same scenarios as 
{{DisableBouncyScrolling}}, but feels a lot nicer. Note that with _both_ 
implementations, if inertia causes the scrolling to hit the top or bottom, you 
still get a small bounce -- I don't think there's any way to avoid that on WP8 
at the moment.

I thought I'd share it here, in case you'd like to add it as another option in 
the WP8 Cordova implementation. I'm happy to attempt a pull request if you'd 
like (just not sure the best place for the JS code to live if it's part of the 
'system').

{code:title=BrowserMouseHelper.cs|borderStyle=solid}
            // This goes in the Border_ManipulationDelta event handler
            var allowScroll = _browser.InvokeScript("eval", new string[] { 
"(function(delta) { return isScrollingAllowed(delta); })(" + 
e.DeltaManipulation.Translation.Y.ToString() + ")" }) as string;
            if (allowScroll == "false")
            {
                e.Handled = true;
            }
{code}

{code:title=.js file|borderStyle=solid}
// This goes in a JS file that's part of the app; I'm using jQuery, but it can 
be written without that dependency
isScrollingAllowed = function(delta) {
        var scrollTop = $(document).scrollTop(),
                top = scrollTop === 0,
                bottom = scrollTop + $(window).height() === 
$(document).height();

        return ((top && delta < 0) || (bottom && delta > 0)).toString();
};
{code}



--
This message was sent by Atlassian JIRA
(v6.2#6252)

Reply via email to