Sticky Grouped Headers in Flutter
Course Demo App
Need to create grouped sticky headers?
There is a new widget in town, the SliverMainAxisGroup allows
you to arrange multiple slivers together.
Create sticky headers that are pushed out of view as each sliver
group scrolls by.
You’ll learn to use the SliverMainAxisGroup with AppBar or
SliverPersistentHeaderDelegate to create sticky headers.
Overview
• CustomScrollView using slivers for scrolling effects and performance
• Group slivers with SliverMainAxisGroup widget containing sticky headers and grouped data
• Create sticky headers for each group by using SliverAppBar
• Alternatively create sticky headers for each group by using
SliverPersistentHeaderDelegate
• Format actual grouped data with ListTile and leading Icon
• Create a service to load JSON quotes List and Map them to a class model
• Create reusable widgets
• No third-party packages needed
You can find course resources like project's source code, helper code files, slides at:
https://github.com/JediPixels/course_...
The source_code folder contains the starter project split_screen_responsive_starter and the split_screen_responsive folder contains the final project.
The slides folder contains the PDF slides for the course.
The code_helpers folders contain the final code helper for each file created.
https://jedipixels.dev
#flutter #flutterwidgets #dart #fluttertutorial