Flutter having two SliverPersistentHeader stacked one after another

Viewed 309

I have CustomScrollView with following structure:

CustomScrollView(
            slivers: <Widget>[
              SliverPersistentHeader(
                pinned: true,
                floating: true,
                delegate: AddPageAppBarWidget(
                  plantsCompanion: _plantsCompanion,
                  minExtent: 90.0,
                  maxExtent: 300.0,
                ),
              ),
              SliverList(
                delegate: SliverChildListDelegate([
                  _plantsCompanion.name.present
                      ? NameWidget(name: _plantsCompanion.name.value)
                      : NameWidget(name: ''),
                ]),
              ),
              SliverToBoxAdapter(
                child: ScheduledActivityListWidget(
                   plantId: _plantsCompanion.id.value,
                   scheduledActivities: snapshot.data,
                ),
              ),
              SliverPersistentHeader(
                delegate: LoggedActivitiesSliverAppBarWidget(
                  title: 'Chronology',
                  minExtend: 100,
                  maxExtend: 150,
                ),
                pinned: true,
                floating: true,
              ),
              SliverFixedExtentList(
                    itemExtent: 50.0,
                    delegate: SliverChildBuilderDelegate(
                      (BuildContext context, int index) {
                        return ListTile(
                          leading: Image.asset(
                            loggedActivities[index].activityType.imagePath,
                            height: 40,
                          ),
                          title: Text(formatter
                              .format(loggedActivities[index].created)),
                        );
                      },
                      childCount: 30,
                    ),
                  ),
            ],
          )

The issue I have - the second SliverPersistentHeader goes beneath the first one, while I would like to have it stacked just after it. If I replace the second SliverPersistentHeader with SliverAppBar, I can achieve the desired effect, however, SliverAppBar takes way too much space, hence I would like to replace it with SliverPersistentHeader

0 Answers
Related