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

Tap on element inside SliverStickyHeader hit test gets broken when using with floating SliverAppBar #80

Closed
BOGDANOLEKSANDR opened this issue Aug 18, 2022 · 6 comments · Fixed by #83

Comments

@BOGDANOLEKSANDR
Copy link

Hi, I was trying to add some interaction to elements inside SliverStickyHeader and floating SliverAppBar. Noticed that when you scroll the list down till the SliverAppBar disappears and then scroll up a little bit until SliverAppBar appears again, the onTap event won't fire any more.

Below I'm adding the code that reproduces the issue. I have added a clickable element "Sometimes I'm not clickable" and a "Shop" title.
To reproduce the issue you need to scroll the list down till the SliverAppBar disappears and then scroll up a little bit until SliverAppBar appears again. You should see that hit test moves from "Sometimes I'm not clickable" element to the "Shop" title, and "Sometimes I'm not clickable" becomes not clickable until you scroll all the way to the top of the list.

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

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

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        body: CustomScrollView(
          slivers: [
            const SliverAppBar(title: Text('Example'), titleSpacing: 0, floating: true),
            SliverStickyHeader(
              header: Column(
                children: [
                  Container(
                    alignment: Alignment.center,
                    height: 60.0,
                    width: double.infinity,
                    color: Colors.white,
                    child: const Text('Shop', style: TextStyle(fontSize: 20.0)),
                  ),
                  InkWell(
                    onTap: () => print('111111'),
                    child: Container(
                        alignment: Alignment.center,
                        height: 60,
                        width: double.infinity,
                        color: Colors.red,
                        child: const Text('Sometimes I\'m not clickable')),
                  ),
                ],
              ),
              sliver: SliverList(
                delegate: SliverChildBuilderDelegate(
                  (BuildContext context, int index) {
                    return Card(
                      margin: const EdgeInsets.all(8.0),
                      child: Container(
                        color: Colors.blue[100 * (index % 9 + 1)],
                        height: 80,
                        alignment: Alignment.center,
                        child: Text("Item $index", style: const TextStyle(fontSize: 20)),
                      ),
                    );
                  },
                  childCount: 100,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

@nasirdev74
Copy link

same here. did you find any solution ??

@BOGDANOLEKSANDR
Copy link
Author

Unfortunately, not yet...

@KanybekMomukeyev
Copy link

Absolutelly same here, @BOGDANOLEKSANDR did you find solution?

@KanybekMomukeyev
Copy link

@letsar is there any solution for this issue? This is critical bug coming from library.

@agoldm
Copy link

agoldm commented Sep 7, 2022

Same here. Can anyone tell why this is happening?

@darrillaga
Copy link
Contributor

darrillaga commented Oct 18, 2022

Same here, I've also found that tap events get like an offset from the visible element position.
So tapping at some distance on top shows a tap on the button, meaning that there is a kind of offset is being applied on the gesture or something like that.

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

Successfully merging a pull request may close this issue.

5 participants