Api call flutter - flutter

Question

children: [
Text('${cPrayerName} at ${cPrayerTime}'),
Text('Remining time : $remingTime!)'
]
I put my cPrayerName and cPrayerTime and remingTime in a flip widget. at the start of the app, those variables empty the I execute a function that fetch data from API and add that reposne to a list List<PrayerTimeClass> prayerTime = []; then I check my condition then assign it to those variables String cPrayerName = ""; , var cPrayerTime = ""; but it takes some time to see on flip widget i want to get rid of i need imiditate results
Future fetchPrayerTimeNExDay() async {
var time = DateTime.now();
setState(() {
nextDayDate = "$year-$month-$day";
});
Response response =
await dio.get("http://52.90.175.175/api/prayer-time/get/$currentDate");
if (response.data["data"] != null) {
prayerTimeNexDay.add(PrayerTimeClass.fromJson(response.data["data"]));
}
This is condition i check
Dio dio = Dio();
static List<PrayerTimeClass> prayerTime = [];
Future fetchPrayerTime() async {
String year = DateTime.now().year.toString();
String month = DateTime.now().month.toString().padLeft(2, '0');
String day = DateTime.now().day.toString().padLeft(2, '0');
var time = DateTime.now();
setState(() {
currentDate = "$year-$month-$day";
});
Response response =
await dio.get("http://localhost/api/prayer-time/get/$currentDate");
if (response.data["data"] != null) {
prayerTime.add(PrayerTimeClass.fromJson(response.data["data"]));
DateTime fajirTime = DateFormat("yyyy-MM-dd HH:mm:ss").parse(
"${DateTime.now().toString().substring(0, 10)} ${prayerTime[0].fajir}");
DateTime dhuhrTime = DateFormat("yyyy-MM-dd HH:mm:ss").parse(
"${DateTime.now().toString().substring(0, 10)} ${prayerTime[0].dhuhar}");
DateTime asrTime = DateFormat("yyyy-MM-dd HH:mm:ss").parse(
"${DateTime.now().toString().substring(0, 10)} ${prayerTime[0].asr}");
DateTime magribTime = DateFormat("yyyy-MM-dd HH:mm:ss").parse(
"${DateTime.now().toString().substring(0, 10)} ${prayerTime[0].magrib}");
DateTime ishaTime = DateFormat("yyyy-MM-dd HH:mm:ss").parse(
"${DateTime.now().toString().substring(0, 10)} ${prayerTime[0].isha}");
DateTime now = DateTime.now();
DateTime nextDayFajirTime = DateFormat("yyyy-MM-dd HH:mm:ss").parse(
"${DateTime.now().toString().substring(0, 10)} ${prayerTimeNexDay[0].fajir}");
if (now.isBefore(fajirTime)) {
setState(() {
cPrayerName = "Fajr";
cPrayerTime = DateFormat.Hms().format(fajirTime);
remingTime = fajirTime.difference(now);
});
} else if (now.isAfter(fajirTime) && now.isBefore(dhuhrTime)) {
setState(() {
cPrayerName = "Duhur";
cPrayerTime = DateFormat.Hms().format(dhuhrTime);
remingTime = dhuhrTime.difference(now);
});
} else if (now.isAfter(dhuhrTime) && now.isBefore(asrTime)) {
setState(() {
cPrayerName = "Asr";
cPrayerTime = DateFormat.Hms().format(asrTime);
remingTime = asrTime.difference(now);
});
} else if (now.isAfter(asrTime) && now.isBefore(magribTime)) {
setState(() {
cPrayerName = "Magrib";
cPrayerTime = DateFormat.Hms().format(magribTime);
remingTime = magribTime.difference(now);
});
} else if (now.isAfter(magribTime) && now.isBefore(ishaTime)) {
setState(() {
cPrayerName = "Isha";
cPrayerTime = DateFormat.Hms().format(ishaTime);
remingTime = ishaTime.difference(now);
});
} else {
setState(() {
cPrayerName = "Prayer";
cPrayerTime = "Fajr";
remingTime = fajirTime.difference(now);
});
}
}
}

Answer 1

Call your API in your init method and instead of using FutureBuilder, use only the Builder if needed or even you don't need it at all if you're saving data into a list.
Note: You shouldn't call async method directly into the init method. Instead put it into another method/function that is not async or returning anything.
Here's an example how it'll be done:
getPrayerTime(){
Future fetchPrayerTimeNExDay() async {
//api logic
}
}
getPrayerTimeNextDay(){
Future fetchPrayerTime() async {
//api logic
}
}
#override
void initState() {
super.initState();
getPrayerTime();
getPrayerTimeNextDay();
}
and here's how Builder widget Looks like:
#override
Widget build(BuildContext context){
return SafeArea(
child: Scaffold(
body: Builder(
builder: (context){
return Container();
},
),
)
);
}