Was ist FutureBuilder in Flutter?

Widget zum Erstellen einer Benutzeroberfläche basierend auf asynchronen Daten, die aus Future abgerufen werden.

Hauptparameter:

• future: Eine Instanz von Future, die beobachtet werden soll.
• initialData: Daten, die vor Abschluss des future angezeigt werden.
• builder: Funktion (AsyncWidgetBuilder), die bei jeder Änderung des future aufgerufen wird und BuildContext sowie AsyncSnapshot erhält.

Zustände von AsyncSnapshot:

• ConnectionState.none: Der Future hat noch nicht begonnen.
• ConnectionState.waiting: Der Future läuft.
• ConnectionState.active: (Selten bei Future) Der Future hat Zwischendaten zurückgegeben.
• ConnectionState.done: Der Future ist abgeschlossen (erfolgreich oder mit Fehler).

Anwendungsbeispiel:

// Angenommen, wir haben eine Funktion, die einen Future<String> zurückgibt
Future<String> fetchData() async {
  await Future.delayed(Duration(seconds: 2)); // Simulation einer Netzwerkanfrage
  return "Daten geladen!";
}

// ... im build-Methoden des Widgets:
@override
Widget build(BuildContext context) {
  return FutureBuilder<String>(
    future: fetchData(), // Unser Future
    builder: (BuildContext context, AsyncSnapshot<String> snapshot) {
      if (snapshot.connectionState == ConnectionState.waiting) {
        // Zeigt einen Ladeindikator, während der Future läuft
        return CircularProgressIndicator();
      } else if (snapshot.hasError) {
        // Zeigt eine Fehlermeldung, wenn der Future mit Fehler endet
        return Text('Fehler: ${snapshot.error}');
      } else {
        // Zeigt die Daten, wenn der Future erfolgreich abgeschlossen wurde
        return Text('Ergebnis: ${snapshot.data}');
      }
    },
  );
}

Vorteile:

• Vereinfacht die Arbeit mit asynchronen Operationen in der UI.
• Baut die UI automatisch neu auf, wenn sich der Zustand des Future ändert.
• Trennt klar die Logik des Ladens der Daten von der Logik des UI-Aufbaus.

Nachteile:

• Kann zu unnötigen Neuberechnungen führen, wenn der Future innerhalb der build-Methode erstellt wird. Es wird empfohlen, den Future einmal zu erstellen (z.B. in initState).