futurebuilder inside expansiontile flutter - list

Question

I have a screen that consist of ExpansionTile and as we know that ExpansionTile has children property. The thing that I would like to do is I need to catch the trigger click of ExpansionTile, so when user click the ExpansionTile it will run FutureBuilder to get a data from API, is there a way to do that. Because until now... ExpansionTile always runs together with the children
Here is part of the code
ExpansionTile(
children:[] //here.. I would like to call the data from api, when user click the expansiontile
title: Text(
"${dataAll["data"][i]["lowongan"]}",
style: GoogleFonts.poppins(
fontWeight: FontWeight.w600,
color: isHovered ||
listLokerModel.value
.lokerState[i]
? dark_button
: Colors.white,
fontSize: 20)),
subtitle: Text(
"${dataAll["data"][i]["start"]} - ${dataAll["data"][i]["end"]}",
style: GoogleFonts.poppins(
color: isHovered ||
listLokerModel.value
.lokerState[i]
? dark_button
: Colors.white,
fontSize: 16)),
trailing: Icon(
Icons.keyboard_arrow_down_sharp,
color: isHovered ||
listLokerModel
.value.lokerState[i]
? dark_button
: Colors.white,
))

Answer 1

Here's simple solution to it.
Inside ExpansionTile, children add FutureBuilder, refer below code, you will get an idea.
class MyWidget extends StatelessWidget {
#override
Widget build(BuildContext context) {
return ExpansionTile(title:Text('hello'),
children:[
FutureBuilder(
builder: (ctx, snapshot) {
if (snapshot.connectionState == ConnectionState.done) {
// If we got an error
if (snapshot.hasError) {
return Center(
child: Text(
'${snapshot.error} occured',
style: TextStyle(fontSize: 18),
),
);
// if we got our data
} else if (snapshot.hasData) {
// Extracting data from snapshot object
final data = snapshot.data as String;
return Center(
child: Text(
'$data',
style: TextStyle(fontSize: 18),
),
);
}
}
// Displaying LoadingSpinner to indicate waiting state
return Center(
child: CircularProgressIndicator(),
);
},
// Future that needs to be resolved
// inorder to display something on the Canvas
future: getData(),
),
]);
}
Future<String> getData() {
return Future.delayed(Duration(seconds: 2), () {
return "I am data";
// throw Exception("Custom Error");
});
}
}