Home > Mobile >  Flutter : Adding item from one list view to another list view
Flutter : Adding item from one list view to another list view

Time:07-02

I am trying to select one item from phone contacts list (List view widget)

class PhoneContacts extends StatefulWidget {
  const PhoneContacts({Key? key}) : super(key: key);

  @override
  State<PhoneContacts> createState() => _PhoneContactsState();
}

class _PhoneContactsState extends State<PhoneContacts> {
  List<Contact> _contacts = [];
  late PermissionStatus _permissionStatus;
  late Customer _customer;

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

  void getAllContacts() async {
    _permissionStatus = await Permission.contacts.request();
    if(_permissionStatus.isGranted) {
      List<Contact> contacts = await ContactsService.getContacts(withThumbnails: false);
      setState(() {
        _contacts = contacts;
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("Phone Contacts"),
        backgroundColor: Colors.indigo[600],
      ),
      body: Container(
        padding: const EdgeInsets.all(5),
        child: ListView.builder(
            itemCount: _contacts.length,
            itemBuilder: (BuildContext context, int index) {
                Contact contact = _contacts[index];
                return contactItem(contact);
            }
        ),
      ),
    );
  }

  Widget contactItem(Contact contact){
    return ListTile(
      onTap: () {
        Navigator.of(context).push(MaterialPageRoute(builder: (context)=>Dashboard(contact)));
      },
      leading: const CircleAvatar(
        backgroundColor: Colors.pinkAccent,
        child: Icon(Icons.person_outline_outlined)),
      title : Text(contact.displayName.toString()),
      subtitle: Text(contact.phones!.first.value.toString()),
    );
  }
}

and insert and display it to dashboard list (another List view widget)

    class Dashboard extends StatefulWidget {
  final Contact? contact;
  const Dashboard([this.contact]);

  @override
  State<Dashboard> createState() => _DashboardState();
}

class _DashboardState extends State<Dashboard> {
  final Color? themeColor = Colors.indigo[600];
  late GlobalKey<RefreshIndicatorState> refreshKey;
  late List<CardGenerator> existingCustomerContactList = getCustomerContactList();

  @override
  void initState(){
    super.initState();
    refreshKey=GlobalKey<RefreshIndicatorState>();
  }

  void addCustomerContact() {
      existingCustomerContactList.add(
          CardGenerator(
              Text(widget.contact!.displayName.toString()),
              const Icon(Icons.account_circle),
              Text(widget.contact!.phones!.first.value.toString())));
  }

  List<CardGenerator> getCustomerContactList () {
  existingCustomerContactList = [
    CardGenerator(
        const Text('Dave', style: TextStyle(fontSize: 24.0), textAlign: TextAlign.start,),
        const Icon(Icons.account_circle, size: 100, color: Colors.white,),
        const Text('Address 1')),
    CardGenerator(
        const Text('John', style: TextStyle(fontSize: 24.0)),
        const Icon(Icons.account_circle, size: 100, color: Colors.white),
        const Text('Address 2')),
    CardGenerator(
        const Text('Richard', style: TextStyle(fontSize: 24.0)),
        const Icon(Icons.account_circle, size: 100, color: Colors.white),
        const Text('Address 3')),
  ];
  return existingCustomerContactList;
}

  Future<void> refreshList() async {
    await Future.delayed(const Duration(seconds: 1));
    setState(() => {
      addCustomerContact(),
      getCustomerContactList()
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.grey[50],
      appBar: AppBar(
        title: const Text("Dashboard"),
        backgroundColor: themeColor,
      ),
      body: RefreshIndicator(
        key: refreshKey,
        onRefresh: () async {
          await refreshList();
        },
        child: Column(
          children: [
            Expanded(
              child: ListView.builder(
                  itemCount: existingCustomerContactList.length,
                  key: UniqueKey(),
                  itemBuilder: (BuildContext context, int index) {
                    return OpenContainer(
                        closedColor: Colors.transparent,
                        closedElevation: 0.0,
                        openColor: Colors.transparent,
                        openElevation: 0.0,
                        transitionType: ContainerTransitionType.fadeThrough,
                        closedBuilder: (BuildContext _, VoidCallback openContainer) {
                          return Card(
                            color: Colors.white,
                            child: GestureDetector(
                              onTap: openContainer,
                              child: SizedBox(
                                height: 140,
                                child: Row(
                                  children: [
                                    Container(
                                      decoration: const BoxDecoration(
                                          color: Colors.indigo,
                                          borderRadius: BorderRadius.only(topLeft: Radius.circular(7.0),bottomLeft: Radius.circular(7.0))
                                      ),
                                      height: 140,
                                      width: 120,
                                      child: existingCustomerContactList[index].icon,
                                    ),
                                    Column(
                                      children: [
                                        Padding(
                                          padding: const EdgeInsets.all(8.0),
                                          child: existingCustomerContactList[index].title,
                                        ),
                                        Padding(
                                          padding: const EdgeInsets.all(8.0),
                                          child: existingCustomerContactList[index].address,
                                        ),
                                      ],
                                    )
                                  ],
                                ),
                              ),
                            ),
                          );
                        },
                        openBuilder: (BuildContext _, VoidCallback openContainer)  {
                          return ConsumerHome();
                        }
                    );
                  }),
            ),
          ],
        ),
      ),
    );
  }
}

I found the 

selected item has been added to the Dashboard items list but when I refresh it it doesn't newly added item in the dashboard list view.

I am a newcomer in flutter please bare with me. I already did my search for this problem unfortunately, no luck.

CodePudding user response:

Change the order of execution. You are adding the item in the list and then making a new list again in the current order

addCustomerContact(),
      getCustomerContactList()

change this to

getCustomerContactList()
addCustomerContact(),
  • Related