I have created one application in flutter in which all the contacts of my device are retrieved in flutter application. I want to select few of the contacts. But when I select any one contact, all of the contacts are being selected. If anyone can help me by making changes in my code, it will be a great help.

Source code:

import 'package:contacts_app/checkbox.dart';
import 'package:flutter/material.dart';
import 'package:contacts_service/contacts_service.dart';
import 'package:contacts_app/smsButton.dart';
import 'package:contacts_app/phoneButton.dart';

class ContactsPage extends StatefulWidget {
  @override
  _ContactsPageState createState() => _ContactsPageState();
}

class _ContactsPageState extends State<ContactsPage> {
  Iterable<Contact> _contacts=[];
  bool value = false;

  @override
  void initState() {
    getContacts();
    super.initState();
  }

  Future<void> getContacts() async {
    //We already have permissions for contact when we get to this page, so we
    // are now just retrieving it
    final Iterable<Contact> contacts = await ContactsService.getContacts();
    setState(() {
      _contacts = contacts;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: _contacts != null
          //Build a list view of all contacts, displaying their avatar and
          // display name
          ? ListView.builder(
              itemCount: _contacts?.length ?? 0,
              itemBuilder: (BuildContext context, int index) {
                Contact contact = _contacts?.elementAt(index);
                return ListTile(
                    contentPadding:
                      const EdgeInsets.symmetric(vertical: 2, horizontal: 18),
                  leading: (contact.avatar != null && contact.avatar.isNotEmpty)
                      ? CircleAvatar(
                          backgroundImage: MemoryImage(contact.avatar),
                        )
                      : CircleAvatar(
                          child: Text(contact.initials()),
                          backgroundColor: Theme.of(context).accentColor,
                        ),
                  title: Text(contact.displayName ?? ''),
                  //This can be further expanded to showing contacts detail
                  // onPressed().
                  trailing: Row(
                    mainAxisSize: MainAxisSize.min,
                    children: <Widget>[
                      PhoneButton(phoneNumbers: contact.phones),
                      SmsButton(phoneNumbers: contact.phones),
                      buildCheckbox()
                    ],
                  ),

                );
              },
            )
          : Center(child: const CircularProgressIndicator()),
    );
  }

  Widget buildCheckbox()=>Checkbox(
    value: value,
    onChanged: (value){
        setState(() {
          this.value=value;
        },
      );

    },
  );
}

Image of issue

CodePudding user response：

take a new list and check in this list thats index item is present if not present then add it if this index item is present then remove it .

List<String> SelectedContact=[];


List<ContactModel>state;//thats contacts list 

Checkbox(
                                value:SelectedContact.contains(state[index].phnono),
                                onChanged: (bool newValue) {
                              if(newValue)
                                {
                                  SelectedContact.add(state[index].phno);
                               
                                }
                              else
                                {
                                  SelectedContact.remove(state[index].phnono);
                                
                                }
                                state[index].ischecked=newValue;
                                },

                              ),

CodePudding user response：

The state of your ContactsPage contains a single boolean bool value = false;.

When you select any contact, this boolean is flipped to true in your state, resulting in a rebuild of all checkboxes, which all use this same value: All are selected.

One way to resolve this is to maintain a boolean selected for each contact. In code, something like:

List<bool> value = [];

And as you load the contacts, you can fill this list with booleans.

Future<void> getContacts() async {
    //We already have permissions for contact when we get to this page, so we
    // are now just retrieving it
    final Iterable<Contact> contacts = await ContactsService.getContacts();
    setState(() {
      _contacts = contacts;

      // initialize the list of booleans to track which contacts are/aren't selected
      value = contacts.map((e) => false).toList();
    });
  }

You can then edit the buildCheckbox function to take in the index, and look at and manipulate the boolean at this index:

Widget buildCheckbox(int index)=>Checkbox(
    value: value[index],
    onChanged: (value){
        setState(() {
          this.value[index]=value;
        },
      );

    },
  );

As a result, when you change the value of a checkbox (by checking/unchecking it), only the single checkbox value is updated.

Alternatively, if you need only 1 contact to be selected at a time (more like a radio button), you can keep an integer that signifies which contact is currently selected. This is simpler, but really depends on what you want to achieve.