Junior
Τι είναι το FutureBuilder στο Flutter;
sobes.tech AI
Απάντηση από AI
Widget για τη δημιουργία διεπαφής βασισμένης σε ασύγχρονα δεδομένα που λαμβάνονται από Future.
Βασικές παράμετροι:
future: Μια περίπτωσηFutureπου θα παρακολουθείται.initialData: Δεδομένα που εμφανίζονται πριν ολοκληρωθεί τοfuture.builder: Συνάρτηση (AsyncWidgetBuilder) που καλείται σε κάθε αλλαγή κατάστασης τουfutureκαι λαμβάνειBuildContextκαιAsyncSnapshot.
Καταστάσεις AsyncSnapshot:
ConnectionState.none: Το Future δεν έχει ξεκινήσει ακόμα.ConnectionState.waiting: Το Future εκτελείται.ConnectionState.active: (Σπάνια για Future) Το Future έχει επιστρέψει ενδιάμεσα δεδομένα.ConnectionState.done: Το Future έχει ολοκληρωθεί (επιτυχώς ή με σφάλμα).
Παράδειγμα χρήσης:
// Ας υποθέσουμε ότι έχουμε μια συνάρτηση που επιστρέφει ένα Future<String>
Future<String> fetchData() async {
await Future.delayed(Duration(seconds: 2)); // Προσομοίωση αίτησης δικτύου
return "Δεδομένα φορτώθηκαν!";
}
// ... στη μέθοδο build του widget:
@override
Widget build(BuildContext context) {
return FutureBuilder<String>(
future: fetchData(), // Το δικό μας Future
builder: (BuildContext context, AsyncSnapshot<String> snapshot) {
if (snapshot.connectionState == ConnectionState.waiting) {
// Εμφανίζουμε δείκτη φόρτωσης ενώ το Future εκτελείται
return CircularProgressIndicator();
} else if (snapshot.hasError) {
// Εμφανίζουμε μήνυμα σφάλματος αν το Future τελειώσει με σφάλμα
return Text('Σφάλμα: ${snapshot.error}');
} else {
// Εμφανίζουμε τα δεδομένα αν το Future ολοκληρωθεί με επιτυχία
return Text('Αποτέλεσμα: ${snapshot.data}');
}
},
);
}
Πλεονεκτήματα:
- Διευκολύνει τη διαχείριση ασύγχρονων λειτουργιών στο UI.
- Ανακατασκευάζει αυτόματα το UI όταν αλλάζει η κατάσταση του
Future. - Διαχωρίζει σαφώς τη λογική φόρτωσης δεδομένων από τη λογική κατασκευής UI.
Μειονεκτήματα:
- Μπορεί να προκαλέσει περιττές ανακατασκευές αν το
Futureδημιουργείται μέσα στη μέθοδοbuild. Συνιστάται η δημιουργία τουFutureμια φορά (π.χ. στοinitState).