I am trying to create a CustomScrollView
with a SliverAppBar
. Since the SliverGrid
that contains the main content may frequently have insufficient content to allow scrolling past the 'SliverAppBar', the UI now feels 'stuck'; the user can only scroll until a part of the SliverAppBar
but never until it is hidden.
Therefore, I'm looking for away to allow scrolling only until the SliverAppBar
is hidden.
Below is my current code,
class HomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
body: CustomScrollView(
slivers: <Widget>[
SliverAppBar(
backgroundColor: Colors.green,
expandedHeight: 500.0,
flexibleSpace: FlexibleSpaceBar(
background: Image.asset(
'tree_logo.jpg',
fit: BoxFit.cover,
),
),
),
SliverGrid.count(
crossAxisCount: 4,
crossAxisSpacing: 20.0,
mainAxisSpacing: 20.0,
childAspectRatio: 4 / 3,
children: [
PermissibleModuleCard(
moduleTitle: 'Master Data',
moduleDescription:
'Edit berbagai master-master data (client, supplier, tenaga kerja & material) serta konstanta-kosntanta lainnya (PPN, Alamat, etc.)',
),
],
),
],
),
);
}
}