Server response only showing circular progress dialog and not API data Flutter

Question

I seriously need assistance. I want to show API data on a listview, but It is not showing, only showing circular progress dialog. My api function is working well as it is printing valid json data on console. When I show and navigate to ResultsPage, It just shows circular progress dialog and not the data. Can you tell me where am I going wrong, why the data is not displaying Your help will be appreciated.

My API function

Future<List<Autogenerated>?> signInData() async {
    final prefs = await SharedPreferences.getInstance();
    final String? token = prefs.getString('token');

    try {
      Response response = await _dio.post('$_baseUrl/api/gateway',
          data: {
            "ClientPackageId": "0cdd231a-d7ad-4a68-a934-d373affb5100",
            "PlatformId": "ios",
            "ClientUserId": "AhmedOmar",
            "VinNumber": VINumber
          },
          options: Options(
            headers: {
              "Content-Type": "application/json;charset=UTF-8",
              "Charset": 'utf-8',
              "Authorization": "Bearer $token",
            },
          ));
      print("data is here");
      print(json.encode(response.data));
      print(response.statusCode);
      if (response.statusCode == 200) {
        print("decoded");

        List<Map<String, dynamic>> map = [];
        map = List<Map<String, dynamic>>.from(
            jsonDecode(json.encode(response.data)));
        print(map);
        // return List<Autogenerated>.from(
        //     response.data.map((i) => Autogenerated.fromJson(i)));
        // return Autogenerated.fromJson(jsonDecode(json.encode(response.data)));
      } else if (response.statusCode == 500) {
        // call your refresh token api here and save it in shared preference
        print(response.statusCode);
        await getToken();
        signInData();
      } else {
        throw Exception('Failed to load data');
      }
    } catch (e) {
      print(e);
    }
    //  return null;
  }

Where I want to show the list

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

  @override
  _ResultsPageState createState() => _ResultsPageState();
}

class _ResultsPageState extends State<ResultsPage> {
  Future<List<Autogenerated>?>? objectList;
  _APIState? api;

  @override
  void initState() {
    super.initState();
    objectList = api?.signInData();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
            //centerTitle: true,
            ),
        body: Center(
          child: FutureBuilder<List<Autogenerated>?>(
            future: objectList,
            builder: (context, snapshot) {
              if (snapshot.hasData) {
                print("snapshot data:");
                print(snapshot.hasData);
                return Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: ListView.builder(
                      itemCount: snapshot.data?.length,
                      itemBuilder: (context, index) {
                        var title = snapshot.data?[index].category;
                        // var company = snapshot.data[index]['company_name'];
                        // var skills = snapshot.data[index]['skills'];
                        // var description = snapshot.data[index]['description'];
                        // var positions = snapshot.data[index]['positions'];
                        return Card(
                          shape: RoundedRectangleBorder(
                            side: BorderSide(
                              color: Colors.green.shade300,
                            ),
                            borderRadius: BorderRadius.circular(15.0),
                          ),
                          child: ListTile(
                            leading: Text(title!),
                            title: Text(title),
                            subtitle: Text(
                              title + '\n' + title,
                            ),
                            trailing: Text(title),
                          ),
                        );
                      },
                    ));
              } else if (snapshot.hasError) {
                return Text('${snapshot.error}');
              }

              // By default, show a loading spinner.
              return const CircularProgressIndicator();
            },
          ),
        ));
  }
}

There is no return statement when you get statusCode 200. That progressbar ahs no condition you ahve to write something to hide that — Hardik Mehta, Jun 27 '22 at 10:36
you can follow this : https://stackoverflow.com/questions/51983011/when-should-i-use-a-futurebuilder — Hardik Mehta, Jun 27 '22 at 10:43

score 0 · Answer 1 · answered Jun 27 '22 at 10:46

You need to open the comment and return.

Future<List<Autogenerated>?> signInData() async {
    final prefs = await SharedPreferences.getInstance();
    final String? token = prefs.getString('token');

    try {
      Response response = await _dio.post('$_baseUrl/api/gateway',
          data: {
            "ClientPackageId": "0cdd231a-d7ad-4a68-a934-d373affb5100",
            "PlatformId": "ios",
            "ClientUserId": "AhmedOmar",
            "VinNumber": VINumber
          },
          options: Options(
            headers: {
              "Content-Type": "application/json;charset=UTF-8",
              "Charset": 'utf-8',
              "Authorization": "Bearer $token",
            },
          ));
      print("data is here");
      print(json.encode(response.data));
      print(response.statusCode);
      if (response.statusCode == 200) {
        print("decoded");

        List<Map<String, dynamic>> map = [];
        map = List<Map<String, dynamic>>.from(
            jsonDecode(json.encode(response.data)));
        print(map);
        // return List<Autogenerated>.from(
        //     response.data.map((i) => Autogenerated.fromJson(i)));
        // return Autogenerated.fromJson(jsonDecode(json.encode(response.data)));
      } else if (response.statusCode == 500) {
        // call your refresh token api here and save it in shared preference
        print(response.statusCode);
        await getToken();
        signInData();
      } else {
        throw Exception('Failed to load data');
      }
    } catch (e) {
      print(e);
    }
    //  return null;
  }```

I returned return List.from( response.data.map((i) => Autogenerated.fromJson(i))); and I am getting an error type 'List' is not a subtype of type 'Map' — SaDev, Jun 27 '22 at 11:48
Comment on the code: List> map = []; map = List>.from( jsonDecode(json.encode(response.data))); print(map); and try again. — Sulaymon Ne'matov, Jun 27 '22 at 11:54
Try return this code: return Autogenerated.fromJson(jsonDecode(json.encode(response.data))); — Sulaymon Ne'matov, Jun 27 '22 at 12:03

Server response only showing circular progress dialog and not API data Flutter

1 Answers1