Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to prevent overscrolling of screen even if there's a not so much of elements in viewport? #6

Open
Nurik7 opened this issue Jan 30, 2024 · 4 comments

Comments

@Nurik7
Copy link

Nurik7 commented Jan 30, 2024

I've made small explanation of what I have and what I'm expecting

IMG_0210.MP4

here's the code of actual Example Widget:

class Example extends StatelessWidget {
  const Example({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: CustomScrollView(
        slivers: [
          CupertinoSliverNavigationBar(
            largeTitle: Text("Example screen"),
          ),
          SliverList.builder(
            itemBuilder: (context, index) {
              return Container(
                padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 10),
                child: const Row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Icon(
                      CupertinoIcons.check_mark_circled,
                      color: CupertinoColors.systemIndigo,
                    ),
                    SizedBox(
                      width: 15,
                    ),
                    Expanded(
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.start,
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Opacity(opacity: 0.5, child: Text("kspo/super_cupertino_navigation_bar")),
                          SizedBox(
                            height: 5,
                          ),
                          Text("Placeholder text offset when scaling up system accessibility text size"),
                          SizedBox(
                            height: 5,
                          ),
                          Opacity(
                            opacity: 0.5,
                            child: Text(
                              "@kspo, actually, if you have no urgency with your project,",
                              maxLines: 1,
                              overflow: TextOverflow.ellipsis,
                            ),
                          ),
                        ],
                      ),
                    )
                  ],
                ),
              );
            },
            itemCount: 1,
          ),
        ],
      ),
    );
  }
}
@JaidynBluesky
Copy link

+1 for this. This is a small, but quite noticeable behaviour that native iOS has.

@thisisanmolkumar
Copy link

Did anyone find a solution for this?

@techouse
Copy link

techouse commented Sep 4, 2024

Did anyone find a solution for this?

Not a solution, but a workaround.

Create a ScrollController and allow scrolling beyond 0 only when there's a certain number of elements, i.e.

final ScrollController _scrollController = ScrollController();

/// These are arbitrary values
/// Edit this method according to your needs
void _fixOverscroll() {
  if (_scrollController.hasClients) {
    if (_itemCount <= 1) {
      if (_scrollController.offset > 0) {
        _scrollController.jumpTo(0);
      }
    } else if (_itemCount <= 2) {
      if (_scrollController.offset > 60) {
        _scrollController.jumpTo(60);
      }
    } else if (_itemCount <= 3) {
      if (_scrollController.offset > 180) {
        _scrollController.jumpTo(180);
      }
    }
  }
}

@override
void initState() {
  super.initState();
  _scrollController.addListener(_fixOverscroll);
}

@override
void dispose() {
  _scrollController.removeListener(_fixOverscroll);
  _scrollController.dispose();
  super.dispose();
}

@override
Widget build(BuildContext context) {
  // stuff
}

@esentis
Copy link

esentis commented Sep 19, 2024

+1
This, plus the refresh indicator, are the two things that need to be implemented.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants