Skip to content

OverscrollNotification does not work on iOS #17649

New issue
New issue
Open
Open
OverscrollNotification does not work on iOS#17649
Labels
P2Important issues not at the top of the work listcustomer: alibabad: api docsIssues with https://api.flutter.dev/f: cupertinoflutter/packages/flutter/cupertino repositoryf: material designflutter/packages/flutter/material repository.f: scrollingViewports, list views, slivers, etc.found in release: 3.10Found to occur in 3.10found in release: 3.7Found to occur in 3.7frameworkflutter/packages/flutter repository. See also f: labels.has reproducible stepsThe issue has been confirmed reproducible and is ready to work onplatform-iosiOS applications specificallyteam-iosOwned by iOS platform teamtriaged-iosTriaged by iOS platform teamworkaround availableThere is a workaround available to overcome the issue
@korbin-w

Description

@korbin-w
korbin-w
opened on May 16, 2018 · edited by zoechi

Steps to Reproduce

  1. Add an OverscrollNotification to a ListView, take Gallery as an example
  2. Scroll down to the bottom of the list
  3. There's no notification callback on iOS, while OK on Android.

Modify the Gallery code as an example,

list_demo.dart line 237
The code after modified:

body: new Scrollbar(
        child: new NotificationListener<OverscrollNotification>(child: new ListView(
          padding: new EdgeInsets.symmetric(vertical: _dense ? 4.0 : 8.0),
          children: listTiles.toList(),
        ),
          onNotification: (OverscrollNotification notification) {
            print("====shubin debug: notification ${notification.overscroll}");
            if (notification.overscroll > 0 ) {
              print("====shubin debug: notification>0 ${notification.overscroll}");
            }
            return false;
          },

        ),
      ),

The code before modified:

body: new Scrollbar(
        child: new ListView(
          padding: new EdgeInsets.symmetric(vertical: _dense ? 4.0 : 8.0),
          children: listTiles.toList(),
        ),
   
        ),
      ),

To solve this problem, we're using a alternative way on iOS like below. But is the above a problem?

void _handleScrollNotification() {
  if (widget.controller.position.pixels >
      widget.controller.position.maxScrollExtent) {
    if (widget.adapter.hasMore()) {
      widget.adapter.loadMore();
    }
  }
}

Logs

There are logs like "====shubin debug: notification" on Android, but failed on iOS.

Flutter doctor -v:

✓] Flutter (Channel beta, v0.3.2, on Mac OS X 10.12.6 16G1314, locale zh-Hans-HK)
    • Flutter version 0.3.2 at /Users/guoyou/projects/flutter
    • Framework revision 44b7e7d3f4 (4 weeks ago), 2018-04-20 01:02:44 -0700
    • Engine revision 09d05a3891
    • Dart version 2.0.0-dev.48.0.flutter-fe606f890b

[✓] Android toolchain - develop for Android devices (Android SDK 27.0.3)
    • Android SDK at /Users/guoyou/Library/Android/sdk
    • Android NDK at /Users/guoyou/Library/Android/sdk/ndk-bundle
    • Platform android-27, build-tools 27.0.3
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1024-b01)
    • All Android licenses accepted.

[✓] iOS toolchain - develop for iOS devices (Xcode 9.2)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 9.2, Build version 9C40b
    • ios-deploy 1.9.2
    • CocoaPods version 1.4.0

[✓] Android Studio (version 3.1)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin version 24.2.1
    • Dart plugin version 173.4700
    • Java version OpenJDK Runtime Environment (build 1.8.0_152-release-1024-b01)

[✓] IntelliJ IDEA Community Edition (version 2017.2.3)
    • IntelliJ at /Applications/IntelliJ IDEA CE.app
    • Flutter plugin installed
    • Dart plugin version 172.3968.27

[✓] Connected devices (3 available)
    • Android SDK built for x86 • emulator-5554                            • android-x86 • Android 8.0.0 (API 26) (emulator)
    • iPhone (3)                • cd8bf03b9894bcc00eb25fdae9473ff0b2df095a • ios         • iOS 10.3.2
    • iPhone X                  • 8D4A21F9-E417-43CE-8B40-52CEAB6B7D04     • ios         • iOS 11.2 (simulator)

Activity

mjohnsullivan
added
customer: alibaba
on May 16, 2018
eseidelGoogle

eseidelGoogle commented on May 18, 2018

@eseidelGoogle
eseidelGoogle
on May 18, 2018
Contributor

@xster is this likely to be a bug due to the cupertino overscroll behavior?

eseidelGoogle
added
frameworkflutter/packages/flutter repository. See also f: labels.
f: cupertinoflutter/packages/flutter/cupertino repository
on May 18, 2018
eseidelGoogle

eseidelGoogle commented on May 18, 2018

@eseidelGoogle
eseidelGoogle
on May 18, 2018
Contributor

@korbin-w notes this is not a blocker for customer: gold, just a bug.

xster
self-assigned this
on May 18, 2018
xster
added
d: api docsIssues with https://api.flutter.dev/
on May 18, 2018
xster

xster commented on May 18, 2018

@xster
xster
on May 18, 2018
Member

Looking at the code, it seems like it was never set up to respond to iOS 'overscrolls'. The API doc for OverscrollNotification specifically says

A notification that a [Scrollable] widget has not changed its scroll position
because the change would have caused its scroll position to go outside of
its scroll bounds.

which technically isn't true for iOS. However, I also agree that for users looking at the name of the notification class, it's easy to assume that it includes both platforms equally without having to do something like

onNotification: (ScrollNotification notification) {
  if (notification is OverscrollNotification || notification.metrics.outOfRange) => ...
}

@Hixie may have more reasons for the original API design's historical context but either way, we should add more details to the API docs.

Hixie

Hixie commented on May 21, 2018

@Hixie
Hixie
on May 21, 2018
Contributor

iOS doesn't overscroll, it just scrolls normally past the edge of the content and bounces back.

If you want to load more content when the list reaches the end, the usual way is to put in a placeholder widget as the last thing in your list when you run out of data to show (e.g. a circular progress indicator), and then when you have the data, replace the placeholder with the data.

james-lawrence

james-lawrence commented on Nov 21, 2018

@james-lawrence
james-lawrence
on Nov 21, 2018

@Hixie the point of flutter to abstract those details... shouldn't have to care if its ios or not.

kaina404

kaina404 commented on Feb 24, 2019

@kaina404
kaina404
on Feb 24, 2019 · edited by zoechi

Maybe you can look at the scroll_configuration.dart file. In the getScrollPhysics method, the objects returned in different platforms are different.
You can fix the return value of physics to ClampingScrollPhysics

Demo:

ListView.builder(
        itemBuilder: (BuildContext context, int index) {
          return Text('data=$index');
        },
        itemCount: 100,
        physics: ClampingScrollPhysics(),
      )
kaina404

kaina404 commented on Feb 24, 2019

@kaina404
kaina404
on Feb 24, 2019

scroll_configuration.dart

  /// The scroll physics to use for the platform given by [getPlatform].
  ///
  /// Defaults to [BouncingScrollPhysics] on iOS and [ClampingScrollPhysics] on
  /// Android.
  ScrollPhysics getScrollPhysics(BuildContext context) {
    switch (getPlatform(context)) {
      case TargetPlatform.iOS:
        return const BouncingScrollPhysics();
      case TargetPlatform.android:
      case TargetPlatform.fuchsia:
        return const ClampingScrollPhysics();
    }
    return null;
  }
zoechi
added this to the Goals milestone on Feb 25, 2019
xster
removed their assignment
on May 14, 2019
Martibis

Martibis commented on Mar 15, 2020

@Martibis
Martibis
on Mar 15, 2020 · edited by Martibis

Workaround is using ScrollNotification instead of OverScrollNotification and onNotification(n) use if(n.metrics.extentAfter == 0.0)

26 remaining items

Loading
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    P2Important issues not at the top of the work listcustomer: alibabad: api docsIssues with https://api.flutter.dev/f: cupertinoflutter/packages/flutter/cupertino repositoryf: material designflutter/packages/flutter/material repository.f: scrollingViewports, list views, slivers, etc.found in release: 3.10Found to occur in 3.10found in release: 3.7Found to occur in 3.7frameworkflutter/packages/flutter repository. See also f: labels.has reproducible stepsThe issue has been confirmed reproducible and is ready to work onplatform-iosiOS applications specificallyteam-iosOwned by iOS platform teamtriaged-iosTriaged by iOS platform teamworkaround availableThere is a workaround available to overcome the issue

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @mjohnsullivan@xster@zoechi@korbin-w@kakyoism

        Issue actions
          OverscrollNotification does not work on iOS · Issue #17649 · flutter/flutter