Populate datatable from Firestore

[AlexMunth]

Do you have an example for getting data from firebase?

[maxim-saplin]

Nope

[fazaza]

I'm able to achieve this but header ( the first column ) is not visible ! any idea ?

@override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          SizedBox(
            height: 100,
            child: DataTable2(
                columnSpacing: 0,
                horizontalMargin: 12,
                bottomMargin: 10,
                minWidth: 50,
                columns: const <DataColumn>[
                  DataColumn(
                    label: Text('name'),
                  ),
                  DataColumn(label: Text('age'), numeric: true),
                  DataColumn(label: Text('score'), numeric: true),
                ],
                rows: []),
          ),
          Expanded(
            child: FirestoreQueryBuilder<Map<String, dynamic>>(
              pageSize: 10,
              query: FirebaseFirestore.instance.collection('users'),
              builder: (context, snapshot, _) {
                return ListView.builder(
                  itemCount: snapshot.docs.length,
                  itemBuilder: (context, index) {
                    if (snapshot.hasMore && index + 1 == snapshot.docs.length) {
                      snapshot.fetchMore();
                    }
                    final user = snapshot.docs[index].data();
                    return SizedBox(
                      height: 100,
                      child: DataTable2(
                        headingRowHeight: 0,
                        columnSpacing: 0,
                        horizontalMargin: 12,
                        bottomMargin: 10,
                        minWidth: 50,
                        columns: const <DataColumn>[
                          DataColumn(
                            label: Text(''),
                          ),
                          DataColumn(label: Text(''), numeric: true),
                          DataColumn(label: Text(''), numeric: true),
                        ],
                        rows: [
                          DataRow(
                            cells: [
                              DataCell(
                                Text(user['name']),
                              ),
                              DataCell(
                                Text(user['age'].toString()),
                              ),
                              DataCell(
                                Text(user['score'].toString()),
                              ),
                            ],
                          ),
                        ],
                      ),
                    );
                  },
                );
              },
            ),
          ),
        ],
      ),
    );
  }

[fazaza]

@AlexMunth this is what I did to make it work #120 (comment)

[fisforfaheem]

i used this code:

Flexible(
child: DataTable2(
columnSpacing: defaultPadding,
dividerThickness: 1,
horizontalMargin: 36,
minWidth: 1200,
sortAscending: false,
sortArrowIcon: Icons.arrow_upward,
showBottomBorder: true,
headingRowColor: MaterialStateProperty.all(light),
// dataRowColor: MaterialStateProperty.all(headingcolor),
// headingRowColor: MaterialStateProperty.all(
// Color.fromARGB(255, 228, 235, 143)),
border: const TableBorder(
bottom: BorderSide(
color: Colors.black,
width: .4,
style: BorderStyle.solid,
),
),
// headingTextStyle:
// TextStyle(fontWeight: FontWeight.bold),
sortColumnIndex: 0,
columns: const [
DataColumn(
tooltip: 'Name',
label: Text('Name'),
),
// DataColumn(label: Text('Profile')),
DataColumn(
tooltip: 'Email',
label: Text('Email'),
),
DataColumn(
tooltip: 'Mobile',
label: Text('Mobile'),
),
DataColumn(
tooltip: 'Status',
label: Text('Status'),
// numeric: true,
),
DataColumn(
tooltip: 'Action',
label: Text('Action'),
// numeric: true,
),
DataColumn(
tooltip: 'More',
label: Text('More'),
// numeric: true,
),
],
rows: [
for (var i = 0;
i < con.verifiedUserList.length;
i++)
getTableRow(con.verifiedUserList[i], i)
],
),
),
),
const SizedBox(
height: 70,
),
],
),
),
),
);
}

DataRow getTableRow(data, index) {
return DataRow(
cells: [
DataCell(
Row(
children: [
// ImageNetwork(
// image: data['photo_url'].toString(),
// height: 30,
// width: 30,
// // duration: 1000,
// curve: Curves.bounceOut,
// onPointer: true,
// fitAndroidIos: BoxFit.contain,
// fitWeb: BoxFitWeb.contain,
// borderRadius: BorderRadius.circular(50),
// onError: const Icon(
// Icons.error,
// color: Color.fromARGB(255, 238, 153, 147),
// ),
// ),
Text(data['display_name']),
],
),
onTap: () => Get.to(
() => ProfileViewScreenDoctor(
index: index,
doctoremail: data['email'],
),
transition: Transition.cupertino,
duration: Duration(seconds: 3),
),
),

    DataCell(
      Text(
        data['email'].toString(),
      ),
      onTap: () => Get.to(
        () => ProfileViewScreenDoctor(
          index: index,
          doctoremail: data['email'],
        ),
        transition: Transition.cupertino,
        duration: Duration(seconds: 3),
      ),

      // onTap: () => Get.to(() => VerifiedUsersEditScreen(index: index)),
    ),
    DataCell(
      Text(data['phone_number'].toString()),
      onTap: () => Get.to(
        () => ProfileViewScreenDoctor(
          index: index,
          doctoremail: data['email'],
        ),
        transition: Transition.cupertino,
        duration: Duration(seconds: 3),
      ),
    ),

    DataCell(
      onTap: () {},
      Chip(
        visualDensity: VisualDensity.compact,
        elevation: 5,
        // visualDensity: VisualDensity.adaptivePlatformDensity,
        avatar: data['isVerify'].toString() == 'true'
            ? const CircleAvatar(
                backgroundColor: Colors.green,
                child: Icon(Icons.verified_user),
              )
            : const CircleAvatar(
                backgroundColor: Colors.red,
                child: Icon(Icons.dangerous_rounded),
              ),
        label: data['isVerify'].toString() == 'true'
            ? const Text(
                'Verified',
                style: TextStyle(
                  color: Colors.white,
                ),
              )
            : const Text(
                'Not-Verified',
                style: TextStyle(
                  color: Colors.white,
                ),
              ),
        backgroundColor: data['isVerify'].toString() == 'true'
            ? Colors.green
            : Colors.red,
      ),
    ),
    // DataCell(
    //   Chip(
    //     labelStyle: TextStyle(fontSize: 12),
    //     label: data['isVerify']
    //         ? Text("Verified")
    //         : Text(
    //             'Pending',
    //           ),
    //     backgroundColor: Colors.green,
    //   ),
    //   onTap: () => Get.to(() => VerifiedUsersEditScreen(
    //         index: index,
    //       )),
    // ),

    DataCell(
      Row(
        mainAxisSize: MainAxisSize.min,
        children: [
          TextButton(
              onPressed: () {
                Get.to(
                    () => ProfileViewScreenDoctor(
                          index: index,
                          doctoremail: data['email'],
                        ),
                    transition: Transition.cupertino,
                    duration: Duration(seconds: 3));
              },
              child: const Text('View')),
          Flexible(
            child: TextButton(
                onPressed: () {
                  Get.to(
                      () => VerifiedUsersEditScreen(
                            index: index,
                          ),
                      transition: Transition.cupertino,
                      duration: Duration(seconds: 3));
                },
                child: const Text('Edit')),
          )

          // IconButton(
          //     tooltip: 'See Family Members',
          //     onPressed: () {
          //       Get.to(() => FamilyMemberScreen(

          //           //     index: index,
          //           ));
          //     },
          //     icon: Icon(
          //       Icons.family_restroom_rounded,
          //       size: 23.0,
          //       // color: Colors.red[500],
          //       semanticLabel: 'Add a Family Member',
          //     )),
        ],
      ),
      // onTap: () => Get.to(() => VerifiedUsersEditScreen(
      //       index: index,
      //     )),
    ),
    //!User Ban Logic/Code
    DataCell(
      Row(
        mainAxisSize: MainAxisSize.min,
        children: [
          data['isbanned']
              ? Chip(
                  label: Text('Suspended'),
                  backgroundColor: Colors.red,
                )
              : Container(height: 0),
          PopupMenuButton(
            iconSize: 24.0,
            icon: Icon(Icons.more_vert_rounded),
            itemBuilder: (ctx) {
              return [
                PopupMenuItem(
                  child: con.verifiedUserList[index]['isbanned']
                      ? Text(
                          'Un-Suspend',
                          style: TextStyle(color: Colors.green),
                        )
                      : Text(
                          'Suspend',
                          style: TextStyle(color: Colors.red),
                        ),
                  onTap: () {
                    try {
                      if (con.verifiedUserList[index]['isbanned']) {
                        print('ALREADY EXIST ');
                        con.verifiedUserList[index]['isbanned'] = false;

                        Get.snackbar(
                          barBlur: 2,
                          borderRadius: 50,
                          colorText: Colors.white,
                          shouldIconPulse: true,
                          snackStyle: SnackStyle.FLOATING,
                          maxWidth: 400,
                          duration: const Duration(seconds: 2),
                          backgroundColor: drawerColor,
                          titleText: Text(
                            'Un-Suspended',
                            style: TextStyle(color: Colors.green),
                          ),
                          icon: Icon(
                            Icons.done,
                            color: Colors.green,
                          ),
                          '',
                          (data['display_name'] + ' is now Un-Suspended')
                              .toString(),
                          snackPosition: SnackPosition.TOP,
                        );
                      } else {
                        con.verifiedUserList[index]['isbanned'] = true;

                        Get.snackbar(
                          barBlur: 2,
                          borderRadius: 50,
                          colorText: Colors.white,
                          shouldIconPulse: true,
                          snackStyle: SnackStyle.FLOATING,
                          maxWidth: 400,
                          duration: const Duration(seconds: 2),
                          backgroundColor: drawerColor,
                          titleText: Text(
                            'Suspended',
                            style: TextStyle(color: Colors.red),
                          ),
                          icon: Icon(
                            Icons.done,
                            color: Colors.red,
                          ),
                          '',
                          (data['display_name'] + ' is now Suspended')
                              .toString(),
                          snackPosition: SnackPosition.TOP,
                        );
                      } // if null

                      FirebaseFirestore.instance
                          .collection('Users')
                          .doc(con.verifiedUserListOfDocId[index])
                          .update(con.verifiedUserList[index]);

                      con.verifiedUserList.refresh();
                    } catch (e) {
                      print(e);
                    }
                  },
                ),
              ];
            },
          ),
        ],
      ),
    ),
  ],
);

}
}