The SliverList widget in Flutter is used to create a scrollable list of children within a CustomScrollView. It's typically used in scenarios where you need to create a list of items that can be scrolled infinitely or when you want to customize the scroll behavior.
PermalinkAttributes:
delegate (SliverChildDelegate):
- The delegate that controls the list of children. It can be either a SliverChildBuilderDelegate or a SliverChildListDelegate.
semanticIndexCallback (IndexedSemanticsCallback):
- An optional callback that provides the semantic index for each child in the list. This is useful for accessibility purposes.
semanticIndexOffset (int):
- An optional offset to be added to the semantic indexes provided by the semanticIndexCallback. This can be used to ensure unique semantic indexes across multiple SliverList widgets.
itemExtent (double):
- An optional fixed extent for each item in the list. If specified, all items will have the same height, and the scrolling performance may be improved.
PermalinkExample:
import 'package:flutter/material.dart';
class SliverListExample extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('SliverList Widget Example'),
),
body: CustomScrollView(
slivers: [
SliverAppBar(
title: Text('SliverList Example'),
floating: true,
expandedHeight: 200,
flexibleSpace: FlexibleSpaceBar(
background: Image.network(
'https://via.placeholder.com/600x200',
fit: BoxFit.cover,
),
),
),
SliverList(
delegate: SliverChildBuilderDelegate(
(BuildContext context, int index) {
return ListTile(
leading: Icon(Icons.circle),
title: Text('Item $index'),
);
},
childCount: 50,
),
),
],
),
);
}
}
void main() {
runApp(MaterialApp(
home: SliverListExample(),
));
}
Explanation:
In this example, a SliverList widget is used to create a scrollable list of items within a CustomScrollView.
The SliverList widget is added as a sliver within the CustomScrollView.
The delegate attribute of the SliverList is set to a SliverChildBuilderDelegate, which generates list items dynamically based on a builder function.
The builder function within the SliverChildBuilderDelegate creates a ListTile for each item in the list with a leading icon and a title.
The childCount attribute of the SliverChildBuilderDelegate specifies the total number of items in the list.
As a result, you'll see a scrollable list of 50 items with leading icons and titles when you run this code.
Subscribe to our newsletter
Read articles from Vinit Mepani (Flutter Developer) directly inside your inbox. Subscribe to the newsletter, and don't miss out.