Home > Mobile >  How to automatically select all items above the selected one flutter
How to automatically select all items above the selected one flutter

Time:01-02

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:

  1. get the widget and index of the currently selected value using .indexOf()

  2. 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),
            ),
        ],
      ),
    );
  }
}
  • Related