Continue Scroll Event after running a function in Flutter

I have a button which opens an overlay when a mouse is hovering on it. When I scroll the mouse on the button, I want to close the overlay and scroll the page like normal.

Im listening to the scroll event inside the button with a Listener for onPointerSignal like this:

Listener(
  onPointerSignal: (PointerSignalEvent event) {
    if (event is PointerScrollEvent) {
      setState(() {
        volumeSliderExpanded = false;
     });

    // continue the scroll event here somehow?
   }
}

Currently the user needs to 'tick' the mousewheel once to close the overlay and after that normal scrolling will continue since the volumeSlider will no longer be expanded. I would like to start scrolling the page on the first scroll tick after the overlay closes.

Is this possible or am I approaching this wrong?

Solution

It seems that you want the user to start scrolling when hovering over a button, and then be able to navigate normally after closing an overlay. This may be done by controlling the scrolling behavior with a combination of flags and a ScrollController. A thorough explanation of how to do this is provided here:

Initialize a ScrollController and a boolean flag to track whether the overlay is open or not.
```
 ScrollController _controller = ScrollController();
 bool overlayOpen = false;
```

Wrap your button with a Listener and handle the pointer events as mentioned here.

 Listener(
        onPointerSignal: (PointerSignalEvent event) {
          if (event is PointerScrollEvent) {
            setState(() {
              // Close the overlay
              overlayOpen = false;
            });              
           // Continue the scroll event on the page
           _controller.position.animateTo(
             _controller.offset + event.scrollDelta.dy,
             duration: Duration(milliseconds: 300),
             curve: Curves.easeInOut,
           );
         }
       },
       child: YourButtonWidget(), // Replace with your button widget
     ),

Modify your overlay rendering logic based on the overlayOpen flag.

 if (overlayOpen) {
    // Place your overlay content here
 } else {
    // Place the button or page content here
 }

When you want to open the overlay (e.g., on button hover), set overlayOpen to true.
```
 setState(() {
   overlayOpen = true;
 });
```

With this configuration, the overlay will close as soon as the user begins scrolling after hovering over the button, and the page will scroll as intended. Using the overlayOpen option, you may configure how the overlay behaves while using the ScrollController to keep scrolling the page.