CODEWITHSUNDEEP
classflutter
That Guy
That Guy

Reputation: 234

How to create a CheckBoxTile ListView?

So I'm making an app in and I need a listview of checkboxes. And afterwards it needs to display all the checked items on a new screen. So far what I tried gives me the listview but when I tap on one checkbox, all of them get checked. Any help would be appreciated. Thanks!

    bool yes = false
    Widget pro() =>
      Expanded(
        child: ListView(
          children: ListTile.divideTiles(
            context: context,
            tiles: [
              options("Apple"),
              options("Banana"),
            ],
          ).toList(),
        ),
      );

  Widget options(String head) =>
      CheckboxListTile(
        title: Text(head),
        value: yes,
        onChanged: (bool value) {
          setState(() {
            yes = value;
          });
        },
      );

Upvotes: 0

Views: 94

Answers (1)

Niteesh
Niteesh

Reputation: 3130

try this,

 List<bool> isCheckedList = List.filled(2, false, growable: false);
 List<String> selectedItemsList = [];

    Widget pro() =>
      Expanded(
        child: ListView(
          children: ListTile.divideTiles(
            context: context,
            tiles: [
              options("Apple",0),
              options("Banana",1),
            ],
          ).toList(),
        ),
      );

  Widget options(String head,int index) =>
      CheckboxListTile(
        title: Text(head),
        value: isCheckedList[index],
        onChanged: (bool value) {
          setState(() {
             isCheckedList[index] = value;
             value ? selectedItemsList.add(head): selectedItemsList.removeWhere((item) => item == head);
          });
        },
      );

then pass the list while navigating to another page, in this way

Navigator.push(
          context,
          MaterialPageRoute(
            builder: (context) => NewPage(selectedItemsList: selectedItemsList),
          );

then in the new page you can retrieve it this way

class NewPage extends StatelessWidget {
final List<String> selectedItemsList;
NewPage({this.selectedItemsList});

  @override
  Widget build(BuildContext context) {
 

   
    return Container();
  }
}

Upvotes: 2

Related Questions