Not working with CustomScrollView #14

czaku · 2022-04-26T08:31:14Z

Doesn't work when on top of a page that has a CustomScrollView and some slivers inside (SliverList) etc. Only dismisses sideways. If there is no scrollable content in CustomScrollView then works also in vertical. Any tips on how to approach view structure or is it a bug?

Tkko · 2022-04-26T08:33:41Z

Hi @czaku, not a bug, just not implemented yet.

czaku · 2022-04-26T08:34:39Z

Thanks, anything that you are planning to release anytime soon? Asking for a friend :P

Tkko · 2022-04-26T08:37:28Z

Thanks, anything that you are planning to release anytime soon? Asking for a friend :P

Honestly, I tried implementing it before but didn't manage to finish it, I need some kind of help and more free time :D

czaku · 2022-04-26T09:49:02Z

Thanks, I don’t think I am good enough in Dart and Flutter yet, but might give it a try! Thanks, Lukasz Czak Mobile: +44 7895547572

…

On 26 Apr 2022, 09:37 +0100, Tornike ***@***.***>, wrote: > Thanks, anything that you are planning to release anytime soon? Asking for a friend :P Honestly, I tried implementing it before but didn't manage to finish it, I need some kind of help and more free time :D — Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you were mentioned.Message ID: ***@***.***>

azharul-islam · 2022-07-19T06:52:51Z

Trying to implement App Store like dismiss feature that has a full page scrollview. This is the ONLY library that achieves something close. This scrollview dismiss feature is holding it back. Hope you get to finish it 🥺

Tkko · 2022-10-04T19:02:55Z

Hang on guys, almost there

wfe.mov

aytunch · 2022-10-04T20:06:39Z

@Tkko this looks just BEAUTIFUL :)
Please add it to the example folder also when it is finished.
Looking forward to it :D

aytunch · 2022-10-09T16:48:20Z

@Tkko hi, sorry if I am bothering :/
When can we expect this to be merged?
Thanks.

Tkko · 2022-10-10T18:10:32Z

@Tkko hi, sorry if I am bothering :/ When can we expect this to be merged? Thanks.

I have to test it for a few days, but before that you can test the behavior by depending on the feature_branch or on the demo website (on the mobile or in the desktop with developers options opened)

Few thing no to handle from my side, depending on the ScrollPhysics the behavior is different and I'm not sure what to do about that

Android (ClampingScrollPhysics)	iOS (BouncingScrollPhysics)
Screen.Recording.2022-10-10.at.9.41.36.PM.mov	Screen.Recording.2022-10-10.at.9.42.50.PM.mov

aytunch · 2022-10-11T16:17:27Z

@Tkko the video you posted 7 days ago in the above comments show no artifacts. Was that using NoScrollPhysics? Maybe that should be the suggested way to implement this functionality?

Tkko · 2022-10-11T16:44:39Z

@Tkko the video you posted 7 days ago in the above comments show no artifacts. Was that using NoScrollPhysics? Maybe that should be the suggested way to implement this functionality?

Sadly, It was ClampingScrollPhysics, scrolling up behavior was the same. All in all, the current functionality is good enough but not ideal

Tkko · 2022-10-12T11:49:25Z

Looks like the modal_bottom_sheet has same behavior

Ciock · 2022-11-02T12:11:01Z

I made BouncingScrollPhysics works with stretchy_header

Stretchy_headers.mov

DismissiblePage(
  direction: DismissiblePageDismissDirection.down,
  onDismissed: RoutesService.to.doBack,
  child: StretchyHeader.listView(
        headerData: HeaderData(
          blurContent: false,
          headerHeight: Get.width / NibRatioDimension.squareLike.value,
          header: Hero(
            tag: space?.id,
            child: _SpaceCoverImage(
              space: controller.space!,
              height: Get.width / NibRatioDimension.squareLike.value,
            ),
          ),
        ),
        children: [ /* children below image */ ],
      ),
    ),
  ),
);

Tkko · 2023-01-21T13:21:19Z

Guys, It's finally merged, checkout it on pub, and tell me if anything goes wrong.
From my experience, it's pretty stable, but I advice you (or your QA) to spent some time on testing the feature.

Version 1.0.0

aytunch · 2023-01-22T11:44:25Z

@Tkko thank you very much.
In the live demo, if you change the type to multi and try to dismiss a page, it glitches. Can you confirm?
The dismissing starts from the end of the screen

Tkko · 2023-01-23T08:22:53Z

@aytunch Correct, seems like multi directional drag doesn't work well on Web desktop.

Platform	Standard thumb drag	Mouse wheel
iOS	✅	➖
Android	✅	➖
Web Mobile	✅	➖
Web Desktop	✅ - Except multi direction	❌
Mac os	✅ - Except multi direction	❌
Linux	Can't test on mac os	Can't test on mac os
Windows	Can't test on mac os	Can't test on mac os

If anyone can test the behavior on Windows and Linux, it would be much appreciated ❤️

Rogue85 · 2023-05-06T12:58:30Z

@Tkko hi, sorry if I am bothering :/ When can we expect this to be merged? Thanks.

I have to test it for a few days, but before that you can test the behavior by depending on the feature_branch or on the demo website (on the mobile or in the desktop with developers options opened)

Few thing no to handle from my side, depending on the ScrollPhysics the behavior is different and I'm not sure what to do about that

Android (ClampingScrollPhysics) iOS (BouncingScrollPhysics)
Screen.Recording.2022-10-10.at.9.41.36.PM.mov

Screen.Recording.2022-10-10.at.9.42.50.PM.mov

Do you have any ideas on how to avoid scrolling during dismissal animation?

Tkko · 2023-05-06T13:28:49Z

Hey @Rogue85 I'm not sure how to fix it.

Rogue85 · 2023-05-07T11:35:21Z

I was able to achieve this with SnapshotWidget. It's not the best solution, but I haven't found another one.

astubenbord · 2023-06-20T16:09:33Z

@Rogue85 Maybe check out https://pub.dev/packages/flutter_top_blocked_bouncing_scroll_physics, it basically prevents over-scrolling on top while applying the typical bouncing physics on bottom.

@Tkko: My question is actually the other way around. Is there any way to prevent the DismissiblePage to fire while still scrolling? The behaviour that I'm currently experiencing is that when scrolling down and then up again (mid scroll), DismissiblePage tends to start the dismissing animation although the scroll view has not yet returned to its initial offset.

See here:

Screen.Recording.2023-06-20.at.17.53.51.mov

In the video I let go of the pointer, but it also occurs when keeping the finger/mouse on the screen, i.e. one fluid up then down.

Here's the code from the video above:

import 'package:dismissible_page/dismissible_page.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("My App"),
      ),
      body: Center(
        child: ElevatedButton(
          child: Text("Open"),
          onPressed: () => context.pushTransparentRoute(
            DismissiblePage(
              direction: DismissiblePageDismissDirection.down,
              child: Scaffold(
                body: CustomScrollView(
                  physics: BouncingScrollPhysics(),
                  slivers: [
                    SliverAppBar(
                      title: Text("Scrollable dismissible page"),
                    ),
                    SliverList.builder(
                      itemCount: 30,
                      itemBuilder: (context, index) => ListTile(
                        title: Text("Item $index"),
                      ),
                    )
                  ],
                ),
              ),
              onDismissed: Navigator.of(context).pop,
            ),
          ),
        ),
      ),
    );
  }
}

It might be related to the BouncingScrollPhysics, I cannot reproduce this with ClampingScrollPhysics.

Is there any way to ensure that the dismissible page only starts dismissing when the scroll view is actually at the top? I've already tried attaching listeners to the scroll controller of the scroll view which based on the current offset disables the dismissible page through a local state variable. However, that didn't seem to work well and felt very clunky.

Tkko · 2023-06-20T16:42:56Z

Hey @astubenbord, what happens in the video is that when you scroll up, over scroll event is fired which calls onStart method and when you scroll down DismissiblePage is being dismissed. In short, it looks like a bug. Let me fix it

Tkko · 2023-06-20T17:04:31Z

@astubenbord Can you depend on master branch and verify if the issue is fixed?

  dismissible_page:
    git:
      url: https://github.com/Tkko/Flutter_dismissible_page
      ref: master

astubenbord · 2023-06-20T17:06:55Z

Wow, that was quick, thanks! Will test and report back on thursday if that's fine with you?

astubenbord · 2023-06-26T07:21:58Z

@Tkko First of all sorry for the late reply. The above problem does not occur anymore, thanks a lot! However, when starting the dismissal and then scrolling back up, the page stays in that "dismiss state" instead of first scrolling the whole page back up again before scrolling the inner page content.

See below:

Screen.Recording.2023-06-26.at.09.19.49.mov

Tkko added enhancement New feature or request help wanted Extra attention is needed and removed help wanted Extra attention is needed labels Apr 26, 2022

Ciock mentioned this issue May 11, 2023

Build error upgrading to Flutter 3.10.0 #29

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Not working with CustomScrollView #14

Not working with CustomScrollView #14

czaku commented Apr 26, 2022

Tkko commented Apr 26, 2022

czaku commented Apr 26, 2022

Tkko commented Apr 26, 2022

czaku commented Apr 26, 2022 via email

azharul-islam commented Jul 19, 2022

Tkko commented Oct 4, 2022

aytunch commented Oct 4, 2022

aytunch commented Oct 9, 2022

Tkko commented Oct 10, 2022

aytunch commented Oct 11, 2022

Tkko commented Oct 11, 2022

Tkko commented Oct 12, 2022

Ciock commented Nov 2, 2022

Tkko commented Jan 21, 2023

aytunch commented Jan 22, 2023 •

edited

Tkko commented Jan 23, 2023

Rogue85 commented May 6, 2023

Tkko commented May 6, 2023 •

edited

Rogue85 commented May 7, 2023

astubenbord commented Jun 20, 2023

Tkko commented Jun 20, 2023

Tkko commented Jun 20, 2023

astubenbord commented Jun 20, 2023

astubenbord commented Jun 26, 2023

Not working with CustomScrollView #14

Not working with CustomScrollView #14

Comments

czaku commented Apr 26, 2022

Tkko commented Apr 26, 2022

czaku commented Apr 26, 2022

Tkko commented Apr 26, 2022

czaku commented Apr 26, 2022 via email

azharul-islam commented Jul 19, 2022

Tkko commented Oct 4, 2022

aytunch commented Oct 4, 2022

aytunch commented Oct 9, 2022

Tkko commented Oct 10, 2022

aytunch commented Oct 11, 2022

Tkko commented Oct 11, 2022

Tkko commented Oct 12, 2022

Ciock commented Nov 2, 2022

Tkko commented Jan 21, 2023

aytunch commented Jan 22, 2023 • edited

Tkko commented Jan 23, 2023

Rogue85 commented May 6, 2023

Tkko commented May 6, 2023 • edited

Rogue85 commented May 7, 2023

astubenbord commented Jun 20, 2023

Tkko commented Jun 20, 2023

Tkko commented Jun 20, 2023

astubenbord commented Jun 20, 2023

astubenbord commented Jun 26, 2023

aytunch commented Jan 22, 2023 •

edited

Tkko commented May 6, 2023 •

edited