I have a custom list view with selectable items.And I am trying to select all items automatically present above the one I selected. For Ex: Suppose there is 10 items in the list view and i selected 5th then it should select all the items available above 5th. i.e(1,2,3,4).
return CheckboxListTile(
activeColor: const Color.fromARGB(
255, 243, 243, 243),
checkColor: UIGuide.light_Purple,
selectedTileColor:
UIGuide.light_Purple,
value: value.selecteCategorys
.contains(value.feeList[index]
.installmentName ??
'--'),
onChanged: (bool? selected) async {
value.onFeeSelected(
selected!,
value.feeList[index]
.installmentName,
index,
value.feeList[index].netDue);
},
title: Text(
value.feeList[index].netDue ==
null
? '--'
: value.feeList[index].netDue
.toString(),
textAlign: TextAlign.end,
),
secondary: Text(
value.feeList[index]
.installmentName ??
'--',
),
);
CodePudding user response:
do something like this :
1 - get index of selected item
2 - in the callback fun of checkbox do
let say we have list of items named by items
List<Item> items = [];
foo() {
final upperlist = items.getRange(0, index).toList();
upperlist.forEach((item) {item.selected =true });
items.replaceRange(0, index, upperlist);
setState((){});
}
CodePudding user response:
Note, this example isn't perfect, but it's a working example that can get you thinking, as I don't know the bigger picture
Here's my approach:
get the widget and index of the currently selected value using
.indexOf()
loop over all the widgets until the previously gotten index
for (var i = 0; i < _data.indexOf(item); i ) {
_data[i].isChecked = value!;
}
Code example
create a class called CheckBoxModel
:
class CheckBoxModel {
bool isChecked = false;
String text = "";
CheckBoxModel({required this.isChecked, required this.text});
}
and then, generated 30 widgets:
final _data = List.generate(
30, (index) => CheckBoxModel(isChecked: false, text: "Item $index"));
and used it correspondingly:
Column(
children: [
for (var item in _data)
CheckboxListTile(
value: item.isChecked,
onChanged: (value) {
setState(() {
for (var i = 0; i < _data.indexOf(item); i ) {
_data[i].isChecked = value!;
}
});
},
title: Text(item.text),
),
],
)
Here's a complete runnable snipppet:
import 'package:flutter/material.dart';
const Color darkBlue = Color.fromARGB(255, 18, 32, 47);
void main() {
runApp(MyApp());
}
class CheckBoxModel {
bool isChecked = false;
String text = "";
CheckBoxModel({required this.isChecked, required this.text});
}
final _data = List.generate(
30, (index) => CheckBoxModel(isChecked: false, text: "Item $index"));
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData.dark().copyWith(
scaffoldBackgroundColor: darkBlue,
),
debugShowCheckedModeBanner: false,
home: Scaffold(
body: Center(
child: Testing(),
),
),
);
}
}
class Testing extends StatefulWidget {
const Testing({Key? key}) : super(key: key);
@override
State<Testing> createState() => _TestingState();
}
class _TestingState extends State<Testing> {
@override
Widget build(BuildContext context) {
return SingleChildScrollView(
child: Column(
children: [
for (var item in _data)
CheckboxListTile(
value: item.isChecked,
onChanged: (value) {
setState(() {
for (var i = 0; i < _data.indexOf(item); i ) {
_data[i].isChecked = value!;
}
});
},
title: Text(item.text),
),
],
),
);
}
}