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
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
Get help from others!
Recent Questions
Recent Answers
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP