'Flutter GestureDetector Not Working during AutoScroll

I was trying to detect when a user tapped a container during autoscroll. I am trying to build a scrolling game where a user taps containers inside a listview. However, my gesture detector onTap method does not work during scrolling. It only works after I am done scroling. How do I detect taps while autoscroll goes through my listview. This is my code:


class ColumnScreen extends StatefulWidget {
  const ColumnScreen({Key? key}) : super(key: key);

  @override
  _ColumnScreenState createState() => _ColumnScreenState();
}

class _ColumnScreenState extends State<ColumnScreen> {
  final ScrollController _controller = ScrollController();
  void _scrollDown() {
    _controller.animateTo(
      _controller.position.maxScrollExtent,
      duration: Duration(seconds: 2),
      curve: Curves.linear,);
  }
  @override
  void initState() {
    WidgetsBinding.instance!.addPostFrameCallback((_){
      //write or call your logic
      //code will run when widget rendering complete
      _scrollDown();
    });
    super.initState();
  }
        @override
  Widget build(BuildContext context) {
    final screenHeight = MediaQuery.of(context).size.height;
    final screenWidth = MediaQuery.of(context).size.width;
    return RotatedBox(
      quarterTurns: 2,
      child: Container(
        height: screenHeight,
        width: screenWidth/4,
        color: Colors.yellow,
        child: ScrollConfiguration(
          behavior: ScrollConfiguration.of(context).copyWith(scrollbars: false),
          child: ListView.builder(
            physics: NeverScrollableScrollPhysics(),
              itemCount: 5,
              controller: _controller,
              itemBuilder: (context, index)
              {
                return GestureDetector(
                  behavior: HitTestBehavior.translucent,
                  onTapDown: (_){
                    print("Tap at ${index}");
                  },
                  child: Column(
                    children: [
                      Container(
                        height: screenHeight/4.5,
                        width: screenWidth/4,
                        color: Colors.grey,
                        child: Text("Index: ${index}"),
                      ),
                      Divider(
                        thickness: 1,
                        color: Colors.black,
                      ),
                    ],
                  ),
                );
              }
          ),
        )
      ),
    );
  }
}



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source