Using SliverOverlapInjector to prevent overlapping

Question

I wanted to create a NestedScrollView. So it works as it should be but. it's overlapping. The thing is I really couldn't find how should I put this SliverOverlapInjector to the body of the NestedScrollView.

Here's my code:

NestedScrollView(
        headerSliverBuilder: (context, innerBoxIsScrolled) => [
          SliverToBoxAdapter(
            child: PatientHeader(
              patientData: patientData,
            ),
          ),
          SliverOverlapAbsorber(
            handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
            sliver: SliverPersistentHeader(
              pinned: true,
              delegate: CustomSliverAppBarDelegate(
                expandedHeight: 85,
                patientData: patientData,
              ),
            ),
          ),
        ],
        body: Builder(builder: (context) {
          return Column(
            children: [
              SliverOverlapInjector(
                  handle:
                      NestedScrollView.sliverOverlapAbsorberHandleFor(context),
                ),
             
              Obx(
                () => LazyLoadIndexedStack(
                    index: controller.tabIndex.value,
                    children: [
                      const ActivityTimeLine(),
                      PersonalInformationView(
                        patientData: patientData,
                      ),
                      const MedicalQuestionsView(),
                      const NoteView(),
                      const AccommodationView(),
                      const BeforeAfterView(),
                      const ArrivalDepartureView(),
                      const TestResultView(),
                      const OfferView(),
                      const AgentsView(),
                    ]),
              ),
            ],
          );
        }),
      ),

I don't want to use another CustomScrollView at body because I implemented scroll views already inside of tabs. So in my code I can not use SliverOverlapInjector because it's a sliver. So is there any other RenderBox widget that takes slivers parameter instead of children (Probably I am misunderstanding the concept of slivers) ? Or do I must change my implementation?

Answer 1

You can use the injector inside CustomScrollView slivers, if you don't want to use CustomScrollView and you do know the height of the header you are wrapping with absorber simply use column with SizedBox as first child and height of sized box will be height of header and Expanded widget as second child, and do whatever you want inside expanded.

For example my header delegate has double get minExtent => 60;

so I will give height 60 for Sizedbox.