简体   繁体   中英

How do I build a searched list of users inside of an alert dialog?

I am currently attempting to make a user search list within an alert dialog, which will query users from the project's database based on the user's search input. I am doing this in Android Studio, using Flutter's native language (Dart) and Firebase Cloud Firestore. I have the search bar itself working, but for some reason, whenever I try to actually get the results from the database, my code will access the stream for the Streambuilder being used, but will never touch the actual builder, skipping it entirely. What exactly am I doing wrong here?

The function responsible for creating the alert dialog:

Future createAlertDialog(BuildContext context){
    String userToSearch = '';
    bool showUsers = false;
    return showDialog(context: context, builder: (context){
      return AlertDialog(
        title: const Text("Search for a user:"),
        content: StatefulBuilder(
          builder: (context, setState) => Container(
            child: CupertinoSearchTextField(
              onChanged: (value) => {
                setState(() {
                  showUsers = true;
                }),
                showUsers
                ? Expanded(
                  child: StreamBuilder(
                    stream: FireStoreMethods().searchUsers(value),
                    builder: (context, snapshot) {
                      if (snapshot.connectionState ==
                          ConnectionState.waiting) {
                        return const Center(
                          child: CircularProgressIndicator(),
                        );
                      }
                      if (snapshot.connectionState ==
                          ConnectionState.none) {
                        return const Center(child: Text("Internet error"));
                      }
                      if (snapshot.hasError) {
                        return const Center(
                          child: Text("Something  went wrong."),
                        );
                      }
                      return ListView.builder(
                        shrinkWrap: true,
                        itemCount: snapshot.data!.docs.length,
                        itemBuilder: (context, index) {
                          return ListTile(
                            onTap: () => Navigator.of(context).push(
                              MaterialPageRoute(
                                builder: (context) => ProfileScreen(
                                  uid: snapshot.data!.docs[index]['uid'],
                                ),
                              ),
                            ),
                            leading: CircleAvatar(
                              backgroundImage: NetworkImage(
                                snapshot.data!.docs[index]['photoUrl'],
                              ),
                              radius: 16,
                            ),
                            title: Text(
                              snapshot.data!.docs[index]['username'],
                            ),
                          );
                        },
                      );
                    },
                  ),
                )
                    : const Expanded(child: Text("error"))
              }
            ),
          ),
        )
      );
    });
  }

Function responsible for querying the database:

Stream searchUsers(String userInput){
    String? currentUserID = FirebaseAuth.instance.currentUser?.uid;
    //String? valueFromFirebase = '';
    Stream s = FirebaseFirestore.instance.collection('users').where('username', isGreaterThanOrEqualTo:  userInput).orderBy('username', descending: false).snapshots();
    return s;
  }

To be clear, I expected this code to create a list of users from the database, under the search bar in the alert dialog, containing the users that match the current input. I tried debugging, changing the positioning of certain lines of code, and comparing and contrasting my code to code I found all over the inte.net. The actual result that I received was the ability to use the search bar and have the input saved properly, but literally nothing happens after pressing enter. No list is rendered, no error is thrown, and the program continues like nothing happened.

You need to place StreamBuilder inside widget tree to make it visible. Currently having inside onChanged which is just callback method for textFiled.

Future createAlertDialog(BuildContext context) {
  String userToSearch = '';
  return showDialog(
      context: context,
      builder: (context) {
        return AlertDialog(
          title: const Text("Search for a user:"),
          content: StatefulBuilder(
            builder: (context, setState) => Column(
              children: [
                CupertinoSearchTextField(
                  onChanged: (value) {
                    setState(() {
                      userToSearch = value;
                    });
                  },
                ),
                userToSearch.isNotEmpty
                    ? Expanded(
                        child: StreamBuilder(
                          stream: FireStoreMethods().searchUsers(userToSearch),
                          ...........
                        ),
                      )
                    : Text("Empty")
              ],
            ),
          ),
        );
      });

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM