Search⌘ K
AI Features
Home
Courses
Managing State in Flutter Using BLoC Pattern

Solution: Implementing a Search Feature

Explore how to build a search feature in Flutter with the BLoC pattern. Understand emitting loading, loaded, and error states during asynchronous API calls. Learn to provide the SearchBloc to widgets and handle user input events, enhancing your app's state management skills.

We'll cover the following...

We hope you did well in the previous exercise! It’s time to compare your solution to ours.

Implementing the search function

To implement the search function, we use the search feature of SWAPI API.

Dart
Future<List<SwapiObject>> search(Category category, String query) async {
    String url = 'https://swapi.dev/api/${category.name}/?search=$query';
    http.Response response = await http.get(Uri.parse(url));
    if (response.statusCode == 200) {
      Map<String, dynamic> jsonResponse =
          Map<String, dynamic>.from(json.decode(response.body));
      List<dynamic> results = jsonResponse['results'];
      return results.map((e) => SwapiObject.fromJson(e)).toList();
    } else {
      throw Exception('Failed to load search results');
    }
  }

  • Line 2: We provide the category and the query to the request URL using category.name and query in the parameter.

  • Line 4: We send the get() request.

  • ...