flutter_sticky_header icon indicating copy to clipboard operation
flutter_sticky_header copied to clipboard

Listener on header sticked

Open royvangeel opened this issue 4 years ago • 4 comments

Is it possible to detect when a header is sticked (like using a listener of provide a callback)? I need to create the effect like in the video; I have a header for each weekday, the calendar above the listview needs to be updated based on the sticked header. I haven't figured out how to do. Thanks!

https://user-images.githubusercontent.com/39674633/143587747-f63970e7-2e1f-4e18-acc2-fd0180ad7e22.mov

royvangeel avatar Nov 26 '21 13:11 royvangeel

Hello Did you find a way to do that? @royvangeel

shw2ypro avatar Dec 13 '21 13:12 shw2ypro

@shw2ypro yes, but not using this package. I managed using the sticky_and_expandable_list package and wrap the upper calendar with a StreamBuilder so the ListView pushes the sticked Date into the sink. But I would like to know how to achieve it with this package.

royvangeel avatar Dec 16 '21 10:12 royvangeel

Interesting use case

letsar avatar Jul 13 '22 17:07 letsar

For anyone needing it, I achieved this by using:

  • ValueNotifier
  • ValueListenableBuilder
  • SliverStickyHeader.builder
  • WidgetsBinding.instance.addPostFrameCallback

Example: Something like here, where in this example I'm changing a header title that looke like "DECEMBER 2022":

  1. Declare your ValueNotifier at the class level, e.g.

ValueNotifier<String> _currentTitleNotifier = ValueNotifier<String>("---");

  1. Wire up your UI to pump out the _currentTitleNotifier value:
ValueListenableBuilder(
    valueListenable: _currentTitleNotifier,
    builder: (context, value, child) {
        return Text(
            value.toString().toUpperCase(),
        );
    },
)
  1. Observe the state.isPinned in the SliverStickyHeader.builder(:
builder: (context, state) {
    String newCurrentTitle = DateFormat("MMMM yyyy")
        .format(group.date)
        .toUpperCase();
    if (state.isPinned &&
        _currentTitleNotifier.value.toString() !=
            newCurrentTitle) {
        WidgetsBinding.instance.addPostFrameCallback((_) {
            _currentTitleNotifier.value =
            newCurrentTitle;
        });
    }
}

The WidgetsBinding.instance.addPostFrameCallback will only get called once, because of the if condition around it. Seems to work well so far.

daveshirman avatar Dec 15 '22 21:12 daveshirman