Single-Selection in Listview.builder Flutter
To create a single selection list using ListView.builder
in Flutter, I'm using a RadioListTile
widget for each item in the list.
Here’s an example of how you can do this:
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
int _selectedIndex = 0;
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Single Selection List'),
),
body: ListView.builder(
itemCount: 5,
itemBuilder: (context, index) {
return RadioListTile(
value: index,
groupValue: _selectedIndex,
onChanged: (value) {
setState(() {
_selectedIndex = value;
});
},
title: Text('Item $index'),
);
},
),
),
);
}
}
This code creates ListView
with a RadioListTile
widget for each item in the list. The RadioListTile
widget handles the selection behavior and displays a radio button next to each item. When the user selects an item, the onChanged
callback is triggered, and the selected index is stored in the _selectedIndex
variable.
You can customize the appearance and behavior of the list items as needed. For example, you can use the title
and subtitle
properties to specify the text for each item or use the trailing
property to add additional widgets to the right of the radio button. Thank you for reading.