Scrolling bug.

Question

Scrolling bug.

Closed this issue 5 months ago · 21 comments

Hello, first of all thank you for this awesome library. When I use nested scroll view or extended nested scroll view this bug doesn't happen. I specifically use this library for stretch support but the bug is pretty annoying.

I'm trying to avoid my container from going beyond appbar. But if I swipe quickly or down and up respectively sometimes (pretty much often) content goes beyond but quickly comes back when you swipe.

NestedScrollViewPlus(
          headerSliverBuilder: (context, __) {
            return [
              SliverOverlapAbsorberPlus(
                handle: NestedScrollViewPlus.sliverOverlapAbsorberHandleFor(context),
                sliver: SliverAppBar(
                  pinned: true,
                  elevation: 0,
                  backgroundColor: Colors.purple,
                  automaticallyImplyLeading: false,
                  toolbarHeight: kMinInteractiveDimensionCupertino,
                  collapsedHeight: topPadding + measures.bottomToolbarHeight - 3,
                  expandedHeight: measures.appbarHeight,
                ),
              ),
            ];
          },
          body: body,
   );
        
Builder(builder: (context) {
            return CustomScrollView(
              physics: const BouncingScrollPhysics(
                parent: AlwaysScrollableScrollPhysics(),
              ),
              slivers: [
                SliverOverlapInjectorPlus(handle: NestedScrollViewPlus.sliverOverlapAbsorberHandleFor(context)),
                SliverToBoxAdapter(
                  child: Container(color: Colors.red, height: 100),
                ),
              ],
            );
          })

I've tried every custom physics and absorber and injector combination that you've provided but no luck. Can you help me why this happens?

Screen.Recording.2024-01-21.at.00.49.19.mov

Answer 1 · 2024-01-21T14:54:32.000Z

Also if I try to disable scrolling by setting physics: const NeverScrollableScrollPhysics(). Unlike the original nested scroll view, bottom-up scrolling is not disabled.

Answer 2 · 2024-01-21T17:03:25.000Z

Thank you for your feedback. Could you please provide a minimal reproducible code sample?

Answer 3 · 2024-01-21T17:20:35.000Z

Of course, thank you for fast reply btw. <3

https://github.com/fikretsengul/nsw_plus_bug

Answer 4 · 2024-01-21T17:31:35.000Z

@idootop I have added original nested scroll view example too. In addition to the example I provided about my original issue, If you also add physics: const NeverScrollableScrollPhysics() inside their customscrollviews and nestedscrollviews, original one doesn't move but nsv_plus moves. (which should not)

Original issue:
https://github.com/idootop/nested_scroll_view_plus/assets/22684086/50a835d6-bb2b-46b5-8faf-e3daf11775cd

Secondary issue:
https://github.com/idootop/nested_scroll_view_plus/assets/22684086/3b7232fe-986b-405a-bcfb-f3da419e88a8

Answer 5 · 2024-01-21T17:35:27.000Z

Alright, I'll look into this issue tomorrow. Now, I'm going to bed. GN zzz

Answer 6 · 2024-01-22T08:48:09.000Z

For issue 1

The problem you're encountering isn't a bug within this library. It appears that the layout defined in your SliverPersistentHeaderDelegate is incorrect. Please review your layout configuration to ensure it's set up correctly.

Final result:

20240122-163300.mp4

For issue 2

I'll schedule a fix for this issue as soon as I can allocate some time for it. Thank you for bringing this to my attention.

Answer 7 · 2024-01-22T10:44:11.000Z

Thank you for your investigation. But your proposed solution doesn't work. It doesn't matter whether I use

SliverAppBar(
  pinned: true,
  stretch: true,
  backgroundColor: Colors.purple,
  collapsedHeight: 100,
  expandedHeight: 160,
),

instead of MyDelegate (with your recommendations) or not. It should work naturally for both to achieve this desired effect like original nested scroll view has. Check this out original behaviour:

Screen.Recording.2024-01-22.at.13.41.18.mov

But instead of this, I'm still getting this behaviour: (Using my delegate or above sliver app bar. Both works same.)

Screen.Recording.2024-01-22.at.13.47.26.mov

This should be related with the package. Am I missing something? What do you think? Thank you again btw. @idootop

Answer 8 · 2024-01-22T11:04:26.000Z

I misunderstood your question earlier. I've replicated the issue and will investigate the cause. I expect to have time to look into this further over the upcoming weekend. By the way, if you're interested, we welcome any pull requests.

Answer 9 · 2024-01-28T05:00:59.000Z

@fikretsengul The issue has been resolved in version v1.0.3. Please let me know if it works for you.

Answer 10 · 2024-01-28T10:31:11.000Z

@idootop Thank you for your effort. I can confirm that NeverScrollableScrollPhysics problem is fixed. Over scrolling bug still persists but it's better now compared to previous version. As you can see it's still happening. Let me know if you think I misconfigured anything.

https://github.com/fikretsengul/nsw_plus_bug

bug.mov

Answer 11 · 2024-01-28T10:56:59.000Z

Yes, the issue with over-scrolling has been mitigated but not completely resolved. I've explored numerous approaches, but unfortunately, there isn't a perfect fix yet. At the moment, I believe its performance is within an acceptable range. I plan to continue seeking a definitive solution when time permits. In the meantime, if you're willing to overlook the drag physics and issue #2, you might consider downgrading to version v1.0.0, where this problem does not exist.

Answer 12 · 2024-01-28T11:15:24.000Z

@fikretsengul Alternatively, you may temporarily switch to this branch: fix/issue4. Regarding issues 2, 3, and 4, I am planning to release a new major update, version 2, with breaking changes to thoroughly address these problems.

Answer 13 · 2024-01-28T11:23:16.000Z

Thank you this works fine without any issue. Waiting for the next update, I wish you a good weekend.

Answer 14 · 2024-01-29T10:18:52.000Z

@idootop Hello again, regardless of the topic, I would like to ask another question based on your experience with scroll physics. I made a customized navigation bar that simulates iOS's navigation bar. I use snap_scroll_physics package for snap effect.

You can access the sample repo at the address below.
https://github.com/fikretsengul/nsw_plus_bug

My question is, as you can see in the video, when I scroll, if the scroll ends within the range I specified for the snap, the snap does not happen. This only applies when I use nested scroll view. If I use a custom scroll view, the same situation does not occur and it works without any problems.

question.mov

I think it is related to the synchronization between two (nested and custom) scroll controllers. I have to use nested scroll view because there are situations where I will use paginated list, so I can't just use custom scroll view. Is there any possible or hacky solution you can suggest to fix this?

(As a note, I would like to point out that the situation has nothing to do with easy_refresh. This is the case even if I don't use it.)

Answer 15 · 2024-01-29T15:11:53.000Z

Could you provide more details about the desired final layout and behavior of your page? Specifically, it would be helpful to know when and where you would like the pagination loading indicators to appear, and the locations where you want to allow the list to overscroll.

Answer 16 · 2024-01-29T16:04:03.000Z

Yes, of course. I made a custom scaffold to compensate for Flutter's shortcomings in sliver navigation bar and achieve the iOS native look and feel. iOS-style improvements such as pull to refresh, search bar pinning, title stretch, bottom bar, hero animations for all etc. At the same time, I want to use this component both with sliver list, masonry and paginated list (infinite_scroll_pagination etc.) and with normal column or tab bar view etc.

Currently everything works fine, including snapping and stretch effect (thanks to your library). But snapping while scrolling, only works with CustomScrollView not with nested scroll views (works only on slow scrolls). Here is the example structure:

https://github.com/fikretsengul/nsw_plus_bug

Screen.Recording.2024-01-29.at.18.56.02.mov

Answer 17 · 2024-01-29T16:21:47.000Z

I also use your NestedScrollViewStatePlus global key to decide whether the content should be scrolled or not. I use SliverFillRemaining or SliverToBoxAdapter to adapt other kind of widgets for body.

Screen.Recording.2024-01-29.at.19.21.08.mov

Answer 18 · 2024-01-29T17:46:39.000Z

Moreover, you can check this tab bar example too:

https://github.com/fikretsengul/flutter_advanced_boilerplate/tree/test

test.mov

Answer 19 · 2024-01-30T11:05:25.000Z

@fikretsengul The version 2.0 of nested_scroll_view_plus has been released. You're welcome to test it and see if it addresses your needs. Please note, I haven't had the chance to test it against the new case you mentioned yesterday regarding the snap_scroll_physics and the custom iOS-style navigation bar. You can find the latest release here: nested_scroll_view_plus v2.0.0

Answer 20 · 2024-01-30T11:35:53.000Z

It works great and I see that scroll performance improved. Thanks for your effort.

The bug can be closed, but if possible and when you have time, I would be very happy if you could take a look at my personal problem above and let me know if you have any ideas.

Have a great day.

@idootop
EDIT: I'm glad to know you could help, and I hope you have fun at the festival. But I think I solved the problem by using NotificationListener and I wanted to share it for those wondering how to do something like this. Previously I was using (snap_scroll_physics):

But now using NotificationListener fixed the problem:

final.mov

Answer 21 · 2024-01-30T11:48:05.000Z

Sure thing! I'm glad to hear the performance is better now. About your personal issue, I'll definitely take a look. I've got the Spring Festival coming up in a couple of weeks, but I'll find some time to check it out. Hope you have an awesome day too!