I am creating a seach page with a textfiel and a listview to show the search results. When I do a search (call the onChange ) the results doesn't apear. I know that the method do what I want but Im not able to show the result I am using bloc/cubit architecture Why is this happend? How can I solve it?

Here is my code

search

class Search extends StatelessWidget {
  const Search({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return BlocConsumer<LayoutCubit, LayoutStates>(listener: (context, state) {
    }, builder: (context, state) {
      var cubit = LayoutCubit.get(context);
      return Scaffold(
          appBar: AppBar(
              title: const Text(
            'Search',
            style: TextStyle(letterSpacing: 2.0, color: Colors.black54),
          )),
          body: Column(children: [
            Container(
              margin: const EdgeInsets.symmetric(horizontal: 10),
              padding: const EdgeInsets.symmetric(vertical: 4, horizontal: 20),
              decoration: BoxDecoration(
                color: Colors.black38.withAlpha(10),
                borderRadius: const BorderRadius.all(
                  Radius.circular(20),
                ),
              ),
              child: Row(children: [
                Expanded(
                  child: TextField(
                    decoration: InputDecoration(
                      hintText: "Search users",
                      hintStyle: TextStyle(
                        color: Colors.black.withAlpha(120),
                      ),
                      border: InputBorder.none,
                    ),
                    onChanged: (String keyword) {
                      cubit.search();
                    },
                  ),
                ),
                Icon(
                  Icons.search,
                  color: Colors.black.withAlpha(120),
                )
              ]),
            ),
            state is LayoutSearchSuccesState
                ? Expanded(
                    child: ListView.separated(
                    padding: const EdgeInsets.only(top: 10),
                    itemCount: cubit.searchUsers.length,
                    separatorBuilder: (context, int index) {
                      return const Divider(
                        color: Colors.grey,
                      );
                    },
                    itemBuilder: (context, index) {
                      String _titleName =
                          cubit.searchUsers[index].name.toTitleCase()  
                              ' '  
                              cubit.searchUsers[index].lastName.toTitleCase();
                      return ListTile(
                          leading: Column(children: [
                            Container(
                                height: 55,
                                width: 55,
                                decoration: const BoxDecoration(
                                    shape: BoxShape.circle,
                                    image: DecorationImage(
                                      fit: BoxFit.cover,
                                      image:
                                          AssetImage('assets/images/boy.jpg'),
                                    )))
                          ]),
                          title: Text(
                            _titleName,
                            style: const TextStyle(
                                fontWeight: FontWeight.bold, fontSize: 18),
                          ),                                
                          ]),
                          onTap: () {});
                    },
                  ))
                : Text('data')
          ]));
    });
  }
}

cubit

  void search() {
    List<UserData> searchUsers = [];
    searchUsers = allUsers
        .where((element) => element.toJson().containsValue('javier'))
        .toList();
    emit(LayoutSearchSuccesState());
    print('all'   allUsers.length.toString());
    print('search'   searchUsers.length.toString());
  }

CodePudding user response：

As Another Solution for your problem you can use the Search Delegate its easy to use and you can Customize it https://api.flutter.dev/flutter/material/SearchDelegate-class.html