idootop / nested_scroll_view_plus

📜 An enhanced NestedScrollView with support for overscrolling for both the inner and outer scrollviews.
https://flutter-nested-scroll-view-plus.vercel.app
MIT License
27 stars 2 forks source link

Scrolling bug. #4

Closed fikretsengul closed 9 months ago

fikretsengul commented 10 months ago

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?

https://github.com/idootop/nested_scroll_view_plus/assets/22684086/d16881d8-7fde-49cf-b173-4ebaddc08560

fikretsengul commented 10 months ago

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

idootop commented 10 months ago

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

fikretsengul commented 10 months ago

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

https://github.com/fikretsengul/nsw_plus_bug

fikretsengul commented 10 months ago

@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

idootop commented 10 months ago

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

idootop commented 9 months ago

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:

https://github.com/idootop/nested_scroll_view_plus/assets/35302658/786bdea4-e6ce-499e-a1ff-7e29f6575133

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.

fikretsengul commented 9 months ago

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:

https://github.com/idootop/nested_scroll_view_plus/assets/22684086/933a3321-6af6-4e27-b53e-7965eb0a6682

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

https://github.com/idootop/nested_scroll_view_plus/assets/22684086/311a8fd8-d2b8-4dbf-8dc2-c986d7187427

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

idootop commented 9 months ago

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.

idootop commented 9 months ago

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

fikretsengul commented 9 months ago

@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

image

https://github.com/idootop/nested_scroll_view_plus/assets/22684086/03dbde1d-b3df-4f6e-af25-45fb407e4582

idootop commented 9 months ago

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.

idootop commented 9 months ago

@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.

fikretsengul commented 9 months ago

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

fikretsengul commented 9 months ago

@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

code code2

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.

https://github.com/idootop/nested_scroll_view_plus/assets/22684086/c213b522-d9a4-41b7-a733-cd4e0f3517c7

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.)

idootop commented 9 months ago

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.

fikretsengul commented 9 months ago

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

https://github.com/idootop/nested_scroll_view_plus/assets/22684086/8a304f56-ae74-490d-998d-d53a4737dd20

fikretsengul commented 9 months ago

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.

image

image

image

image

https://github.com/idootop/nested_scroll_view_plus/assets/22684086/54ebf63d-db96-4a44-9bb1-c3db45f1a9e0

fikretsengul commented 9 months ago

Moreover, you can check this tab bar example too:

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

https://github.com/idootop/nested_scroll_view_plus/assets/22684086/0315c06f-8948-4a19-996f-b5967715b058

image

image

image

image

idootop commented 9 months ago

@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

fikretsengul commented 9 months ago

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):

image

But now using NotificationListener fixed the problem:

image

image

https://github.com/idootop/nested_scroll_view_plus/assets/22684086/64c853fb-2872-4f76-aa9a-f3a9456bda9a

idootop commented 9 months ago

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!