Add pull to refresh support for native scrolling

[hollingberry]

I like your native scrollview, but wouldn't it be cool if pull to refresh could work either way? Look at https://github.com/dantipa/pull-to-refresh-js for reference.

[xAlien95]

Awesome way to use -webkit-scrolling:touch!
With it there'll be less lag on older devices (zynga's one lags on iPhone 4) and there'll be the possibility to see the iOS 7 scrollbar (which is useful for every kind of lists).
You could implement a bounce scrolling feature at the top and the bottom and it will work like the actual scroller (I think).

[mlynch]

I am going to close this. I've been thinking about this quite a lot lately, and I firmly believe that having a custom scroll solution is the best choice right now, even if there are some bugs we need to fix (at least we can fix the bugs, we couldn't do that with the browser "native" version).

Unfortunately, the "native" solutions available in Web Kit are buggy, limited (especially with how they emit scroll events), and they aren't configurable at all. Pull to refresh.js is kind of an overly simplistic hack that wouldn't enable you to do really awesome pull to refresh stuff like you could on any native app. With our own scroll system you can.

I'm happy with the custom scroll performance now that we use Zynga's scroller. It feels good on new devices which is what Ionic is targeting. We really want Ionic to be the framework you can use on new devices to build great hybrid apps. We aren't interested in supporting old devices, since there are lots of solutions out there that do less aggressive things at the cost of broader device compatibility.

Ionic is a framework for the future of devices that basically started with the iPhone 4/S, and Android is catching up. We are playing the long game here.

[sidneys]

I am currently running a large Cordova & AngularJS based project scheduled for release in 2 weeks, and our project dealt with a lot of hurdles Ionic is also trying to tackle.

Our experience has shown that JS-Based scrolling (see also iScroll, etc.) is basically out of the question when 1.big, dynamic lists are to be handled (with angular-based templates, filled via json API) and 2. devices older than the iPhone 4S and basically all Android devices are within the target audience. Thats why webkit-overflow is a must, even on the iPhone 4S when dealing with production-type data.

However, we found a solution to combine pull to refresh (native), fixed headers and native overflow scrolling on iOS. Maybe we can get in touch and exchange some know-how.

[mlynch]

Hey @sidneys, thanks for the note. We do support overflow touch scrolling, but we aren't going to implement any features for it beyond just making it work. We've played with some overflow-enabled pull to refresh and the implementation was hacky and not very interesting to us. But I'd be happy to look at any demos you have.

As for large lists, this is on our roadmap, to build a fast large-list support that still uses our scoll system.

Ionic is really targeted at more powerful devices that we believe will increasingly fill the market over the coming years (as they already dominate in iOS land). Android is a bit slower, but even then only 20% of the market is on 2.x and that will drop off quite a bit in 2014, so we are being patient.

Thanks!

[fredgalvao]

I apologize in advance, my intention is not to resurrect a zombie thread (if this is indeed one of those).

@mlynch , I have and app built in december of 2012 using backbone.js and I'm now rewriting it using angular and Ionic. I've been hacking and prototyping for a few weeks now and I can't agree with you on that performance wise regarding Android devices.
I have a Motorola Moto G, which is an amazing device, running Android 4.4.2, among a few other devices which we test on (ranging from Galaxy S2 to S4), and not even on S4 or Nexus 4 does the performance of a compare to it's overflow-scroll="true" version. And I'm not talking about thousand of items, but instead about hundreds or dozens simple items (thumbnail-text-icon).

Although I agree with you that supporting features such as infinite-scroll and pull-to-refresh on overflow: scroll is a real challenge, I've been there debugging scroll events too once (I know the pain), I think Ionic can easily provide satisfatory fallbacks to these features when overflow-scroll="true" is set. Examples that come in mind are:

• pull-to-refresh becoming an element on it's own above/bellow the list, instead of being hidden behind the list
  • it could be a box with it's own height, that can then be panned/pulled up/down to trigger a refresh on the sibling list

I may be blind by what you guys are already doing on master or any other branches (god, you guys work a lot!), so this performance level I'm seeing may already have improved a lot and I hope it does. Nevertheless I believe that without bigger changes on how Ionic implements scrolling, performance won't be comparable so soon, unless it's a top notch device.

[mlynch]

Well, one thing we are doing now is virtual list support to only render a
subset of a list at any one time.

We will continually revisit this as the native browsers get better. Until
then, we won't be adding any more features to native scrolling as it's just
hacks all the way down and will take us away from solving some more
pressing problems

On Wed, Apr 16, 2014 at 1:08 PM, Frederico Galvão
notifications@github.comwrote:

I apologize in advance, my intention is not to resurrect a zombie thread
(if this is indeed one of those).

@mlynch https://github.com/mlynch , I have and app built in december of
2012 using backbone.js and I'm now rewriting it using angular and Ionic.
I've been hacking and prototyping for a few weeks now and I can't agree
with you on that performance wise regarding Android devices.
I have a Motorola Moto G, which is an amazing device, running Android
4.4.2, among a few other devices which we test on (ranging from Galaxy S2
to S4), and not even on S4 or Nexus 4 does the performance of a compare to it's _overflow-scroll="true"_version. And I'm not talking about thousand of items, but instead about
hundreds or dozens simple items (thumbnail-text-icon).

Although I agree with you that supporting features such as infinite-scroll
and pull-to-refresh on overflow: scroll is a real challenge, I've been
there debugging scroll events too once (I know the pain), I think Ionic can
easily provide satisfatory fallbacks to these features when
overflow-scroll="true" is set. Examples that come in mind are:

• pull-to-refresh becoming an element on it's own above/bellow the
  list, instead of being hidden behind the list
  • it could be a box with it's own height, that can then be
    panned/pulled up/down to trigger a refresh on the sibling list

I may be blind by what you guys are already doing on master or any other
branches (god, you guys work a lot!), so this performance level I'm seeing
may already have improved a lot and I hope it does. Nevertheless I believe
that without bigger changes on how Ionic implements scrolling, performance
won't be comparable so soon, unless it's a top notch device.

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/287#issuecomment-40632276
.

[AlmogBaku]

I agree with @sidneys, we have really rich list - and it just not working properly with iphone 4.
The js-based scroller is flicking(scroll too fast to a huge bouncing padding), and sometimes it even stuck for a while.

using the native bouncing is much much faster and smooth.. the problem is it not supported pull-to-refresh and infinite-load.

[onchainguy-btc]

Is there any way to use ion-refresher and overflow-scroll together now?

[ansgarm]

+1

[ceichinger]

+1

[kyocn]

+1

[5amfung]

+1

[iralution]

+1