TransWikia.com

SliverOverlapAbsorber being able to accept multiple slivers

Stack Overflow Asked by Basic Coder on December 7, 2021

Is there currently a known workaround for supporting multiple Slivers within a SliverOverlapAbsorber?
See: https://github.com/flutter/flutter/issues/52616

One Answer

The workaround I found is to create multiple NestedScrollView and use Builder widget as the body to get proper BuildContext. This workaround may not be the best and will messed up your code, but it solved my issue for now.

This is what I want to achieve:

This is my code:

class OrderPage extends StatelessWidget {
  Widget build(BuildContext context) {
    return Scaffold(
      body: DefaultTabController(
        length: 3,

        /// First level of [NestedScrollView]
        child: NestedScrollView(
          headerSliverBuilder: (_, __) => [],

          /// Use [Builder] to get the [BuildContext]
          /// Name the variable of context as contextNestedOne
          body: Builder(
            builder: (contextNestedOne) {

              /// Second level of [NestedScrollView]
              return NestedScrollView(

                /// Name the variable of context as contextNestedTwo
                headerSliverBuilder: (contextNestedTwo, innerBoxIsScrolled) {
                  return [
                    SliverOverlapAbsorber(
                      handle: NestedScrollView.sliverOverlapAbsorberHandleFor(
                        
                        /// Use contextNestedOne
                        contextNestedOne,
                      ),
                      sliver: SliverAppBar(
                        title: Text('My Orders'),
                        elevation: 0,
                      ),
                    ),
                    SliverOverlapAbsorber(
                      handle: NestedScrollView.sliverOverlapAbsorberHandleFor(

                        /// Use contextNestedTwo
                        contextNestedTwo,
                      ),
                      sliver: SliverAppBar(
                        primary: false,
                        pinned: true,
                        automaticallyImplyLeading: false,
                        titleSpacing: 0.0,
                        elevation: innerBoxIsScrolled ? 4 : 0,
                        title: TabBar(
                          labelColor: Colors.black,
                          tabs: <Widget>[
                            Tab(text: 'Delivered'),
                            Tab(text: 'Processing'),
                            Tab(text: 'Cancelled'),
                          ],
                        ),
                      ),
                    ),
                  ];
                },

                /// Use [Builder] to get the [BuildContext]
                /// Name the variable of context as contextNestedTwo
                body: Builder(
                  builder: (contextNestedTwo) {
                    return CustomScrollView(
                      slivers: <Widget>[
                        SliverOverlapInjector(
                          handle:
                              NestedScrollView.sliverOverlapAbsorberHandleFor(

                            /// Use contextNestedOne
                            contextNestedOne,
                          ),
                        ),
                        SliverOverlapInjector(
                          handle:
                              NestedScrollView.sliverOverlapAbsorberHandleFor(

                            /// Use contextNestedOne
                            contextNestedTwo,
                          ),
                        ),
                        SliverToBoxAdapter(
                          child: Container(
                            height: 200,
                            color: Colors.blue,
                            child: Text('My Orders Body'),
                          ),
                        ),
                      ],
                    );
                  },
                ),
              );
            },
          ),
        ),
      ),
    );
  }
}

Answered by nacasha on December 7, 2021

Add your own answers!

Ask a Question

Get help from others!

© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP