app_sliver
A customizable Flutter package that simplifies the creation of complex scrollable UIs using slivers. app_sliver
provides prebuilt sliver-based widgets including flexible SliverAppBar, SliverList, SliverGrid, persistent headers, and more—all designed to enhance your productivity and UI consistency.
Features
- 📱 SliverAppBar+: Extendable SliverAppBar with rich customization including images, texts, stretch modes, actions, and flexible backgrounds.
- 🧱 AppSliverGrid & AppSliverList: Dynamic sliver grid/list builders for efficient list rendering.
- 🧭 AppSliverTabBar: Integrated tab bar support using
NestedScrollView
and sliver headers. - 🎯 FloatingActionButton Transformer: FAB that scales and moves based on scroll position.
- 🔖 Persistent Headers: Custom header widgets that stay visible on scroll.
Installation
Add this to your pubspec.yaml
:
dependencies:
app_sliver: ^0.0.1
Then run:
flutter pub get
Usage
Sliver AppBar
AppSliverAppBar(
pinned: true,
snap: false,
floating: true,
topTitle: 'Welcome',
bottomTitle: 'Dashboard',
imageSource: 'assets/header.jpg',
actionsList: [Icon(Icons.settings)],
)
Sliver List
AppSliverList<String>(
listData: ['One', 'Two', 'Three'],
child: (item) => ListTile(title: Text(item)),
)
Sliver Grid
AppSliverGrid<int>(
listData: List.generate(20, (i) => i),
child: (item) => Card(child: Center(child: Text('$item'))),
crossAxisCount: 2,
childHeight: 3.5,
childWidth: 2.0,
mainAxisSpacing: 8.0,
crossAxisSpacing: 8.0,
)
Sliver Tab Bar
AppSliverTabBar(
tabHeaders: [Text('Tab 1'), Text('Tab 2')],
tabScreens: [ScreenOne(), ScreenTwo()],
)
FAB with Scroll Positioning
AppSliverWithFabButton(
floatingActionButton: FloatingActionButton(onPressed: () {}),
fabTop: 200.0,
fabRight: 16.0,
pinned: true,
body: AppSliverList<String>(...),
)
License
MIT © Shohidul Islam
Libraries
- app_sliver
- app_sliver_app_bar_sliver_grid
- app_sliver_app_bar_sliver_list
- app_sliver_app_bar_with_body
- app_sliver_stacked
- app_sliver_tab_bar
- app_sliver_with_overlapped_child
- app_sliver_with_profile
- sliver_app_bar/app_sliver_app_bar
- sliver_list/app_sliver_grid
- sliver_list/app_sliver_list
- utils/calculate_sliver_app_bar_bottom_end_position
- widgets/my_sliver_persistent_header_delegate
- widgets/positional_transformer_builder
- widgets/section_header_delegate