extended_nested_scroll_view 1.0.1

Flutter Android iOS web

extended nested scroll view to fix pinned header and inner scrollables sync issues.

extended_nested_scroll_view #

pub package GitHub stars GitHub forks GitHub license GitHub issues flutter-candies

Language: English | 中文简体

NestedScrollView: extended nested scroll view to fix following issues.

1.pinned sliver header issue

2.inner scrollables in tabview sync issue

3.pull to refresh is not work.

4.do without ScrollController in NestedScrollView's body

Web demo for ExtendedNestedScrollView

Example for issue 1 #

give total height of pinned sliver headers in pinnedHeaderSliverHeightBuilder callback

 var tabBarHeight = primaryTabBar.preferredSize.height;
      var pinnedHeaderHeight =
          //statusBar height
          statusBarHeight +
              //pinned SliverAppBar height in header
              kToolbarHeight;

 return NestedScrollView(
        pinnedHeaderSliverHeightBuilder: () {
          return pinnedHeaderHeight;
        },
       

Example for issue 2 #

Step1 #

Put your list which in tabview into NestedScrollViewInnerScrollPositionKeyWidget,and get unique a key

 return extended.NestedScrollViewInnerScrollPositionKeyWidget(
        widget.tabKey,
        ListView.builder(
            itemBuilder: (c, i) {
              return Container(
                alignment: Alignment.center,
                height: 60.0,
                child: Text(widget.tabKey.toString() + ": List$i"),
              );
            },
            itemCount: 100)
        );

Step2 #

get current tab key in innerScrollPositionKeyBuilder callback. this key should as same as in step 1 given.

 extended.NestedScrollView(
        innerScrollPositionKeyBuilder: () {
          var index = "Tab";
          if (primaryTC.index == 0) {
            index +=
                (primaryTC.index.toString() + secondaryTC.index.toString());
          } else {
            index += primaryTC.index.toString();
          }
          return Key(index);
        },

Example for NestedScrollView pull to refresh #

NestedScrollViewRefreshIndicator is as the same as Flutter RefreshIndicator.

 NestedScrollViewRefreshIndicator(
       onRefresh: onRefresh,
       child: extended.NestedScrollView(
         headerSliverBuilder: (c, f) {
           return _buildSliverHeader(primaryTabBar);
         },

Better one to pull to refresh

Please see the example app of this for a full example.

Do without ScrollController in NestedScrollView's body #

  • due to we can't set ScrollController for list in NestedScrollView's body(it will breaking behaviours of InnerScrollController in NestedScrollView),provide Demos

  • pull to refresh,

  • load more

  • scroll to top

    to show how to do it without ScrollController

21
likes
100
pub points
91%
popularity

Publisher

fluttercandies.com

extended nested scroll view to fix pinned header and inner scrollables sync issues.

Repository (GitHub)
View/report issues

Documentation

API reference

License

MIT (LICENSE)

Dependencies

flutter

More

Packages that depend on extended_nested_scroll_view