Flutter PageView body in NestedScrollView with SliverAppBar not hiding the appbar

Viewed 696

I am trying to build a PageView.builder in the body of a NestedScrollView. However, when I scroll the PageView, the SliverAppBar in the headerSliverBuilder doesn't hide. I have tried with a ListView instead of PageView, and it works. But I need the page snapping effect of PageView. Am I doing anything wrong here?

Scaffold(
        key: _scaffoldKey,
        body: NestedScrollView(
          floatHeaderSlivers: true,
          physics: NoImplicitScrollPhysics(parent: ScrollPhysics()),
          headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
            // These are the slivers that show up in the "outer" scroll view.
            return <Widget>[
              SliverAppBar(
                floating: true,
                pinned: false,
                snap: true,
                centerTitle: true,
                automaticallyImplyLeading: false,
                leading: IconButton(
                  color: mainColor,
                  onPressed: () {
                    _menuIconController.forward();
                    _scaffoldKey.currentState.openDrawer();
                  },
                  icon: AnimatedIcon(
                    icon: AnimatedIcons.menu_close,
                    progress: _menuIconController,
                  ),
                ),
                title: Text("Title"),
              ),
            ];
          },
          body: FutureBuilder(
            future: _loading,
            builder: (ctx, snapshot) {
              return snapshot.connectionState != ConnectionState.done || _showLoading ? LoadingWidget() :
              PageView.builder(
                itemCount: _userProfiles.length,
                scrollDirection: Axis.vertical,
                itemBuilder: (ctx, index) {
                  return Profile(
                    userProfile: _userProfiles[index],
                  );
                },
              );
            },
          ),
        ),
      ),

I have tried removing NoImplicitScrollPhysics, but it doesn't have any effect.

1 Answers

Your PageView is vertical, that is why the app bar wont be notified by body.

Try adding physics: PageScrollPhysics() to the ListView to get the page snapping.

Related