Dalam pengembangan aplikasi Flutter, seringkali kita perlu menangani data asinkron, seperti permintaan HTTP, pembaruan status, atau sumber data lainnya. Stream adalah konsep penting dalam Flutter yang memungkinkan kita mengobservasi dan merespons perubahan data secara asinkron. Stream dapat dilihat sebagai aliran data yang berkelanjutan yang dapat mengirimkan nilai-nilai baru seiring waktu.

StreamBuilder adalah widget yang kuat untuk membangun antarmuka pengguna yang responsif berdasarkan data yang diberikan oleh objek Stream. Widget ini memungkinkan kita memperbarui tampilan antarmuka pengguna secara otomatis setiap kali ada perubahan pada data stream.

Berikut adalah langkah-langkah umum dalam menggunakan StreamBuilder:

1. Membuat objek Stream yang menghasilkan data. Stream dapat diperoleh dari berbagai sumber, seperti sumber data yang asinkron, seperti permintaan HTTP menggunakan paket http, atau objek StreamController yang digunakan untuk mengirim data ke stream secara manual.

Sebagai contoh, mari kita buat sebuah stream yang mengirimkan angka secara teratur menggunakan Stream.periodic selama beberapa detik:

Stream<int> countStream() {
  return Stream.periodic(Duration(seconds: 1), (i) => i).take(5);
}

Dalam contoh di atas, countStream() akan menghasilkan stream yang mengirimkan angka dari 0 hingga 4 setiap detiknya. Kita akan mengobservasi stream ini dengan StreamBuilder.

2. Membungkus StreamBuilder di dalam pohon widget Flutter kita dan mengonfigurasi properti-propertinya. Properti utama StreamBuilder adalah stream dan builder.

• Properti stream menerima objek Stream yang akan diobservasi. Setiap kali ada perubahan pada data stream, StreamBuilder akan membangun ulang tampilan antarmuka pengguna.
• Properti builder adalah fungsi yang akan dipanggil setiap kali StreamBuilder perlu membangun ulang tampilan. Fungsi ini menerima konteks (BuildContext) dan snapshot (AsyncSnapshot) yang berisi data terbaru dari stream. kita harus mengembalikan widget yang sesuai berdasarkan snapshot.

Sebagai contoh, kita dapat menggunakan StreamBuilder untuk menampilkan nilai terbaru dari stream sebagai teks:

StreamBuilder<int>(
  stream: countStream(),
  builder: (BuildContext context, AsyncSnapshot<int> snapshot) {
    if (snapshot.hasData) {
      return Text('Count: ${snapshot.data}');
    } else if (snapshot.hasError) {
      return Text('Error: ${snapshot.error}');
    } else {
      return Text('Loading...');
    }
  },
)

Pada contoh di atas, StreamBuilder mengobservasi countStream() yang menghasilkan angka dari 0 hingga 4 setiap detiknya. Ketika snapshot memiliki data (snapshot.hasData), widget Text akan menampilkan nilai dari snapshot (${snapshot.data}). Jika ada kesalahan pada stream (snapshot.hasError), widget Text akan menampilkan pesan error. Jika stream masih dalam proses loading atau belum menghasilkan data (snapshot.connectionState), widget Text akan menampilkan pesan “Loading…”.

3. Di dalam fungsi builder, kita dapat mengakses data terbaru dari snapshot menggunakan properti snapshot.data. Snapshot juga menyediakan informasi lain, seperti apakah stream sedang aktif (snapshot.hasData), apakah stream selesai (snapshot.hasError), atau jika stream belum menghasilkan data (snapshot.connectionState).

kita dapat menggunakan informasi ini untuk membangun tampilan yang sesuai berdasarkan keadaan snapshot. Misalnya, kita dapat menampilkan widget spinner saat data sedang dimuat, atau menampilkan pesan error jika terjadi kesalahan pada stream.

Selain itu, kita juga dapat menggunakan metode lain pada objek AsyncSnapshot seperti snapshot.hasData, snapshot.hasError, snapshot.connectionState, dan lain-lain, untuk memeriksa keadaan stream dan mengambil tindakan yang sesuai.

Selain itu, jika kita ingin membangun tampilan yang lebih kompleks, kita dapat menggunakan snapshot.data untuk mengakses data yang diberikan oleh stream dan menggunakan data tersebut untuk mengatur tampilan antarmuka pengguna secara dinamis.

Dengan menggunakan StreamBuilder, kita dapat membuat antarmuka pengguna yang responsif dan dapat merespons perubahan data yang dikirim melalui stream secara otomatis. Ini sangat berguna ketika kita bekerja dengan data yang diperbarui secara asinkron, seperti data real-time, atau saat kita ingin menampilkan pembaruan UI saat ada perubahan pada sumber data yang diperoleh secara asinkron.

Dengan demikian, StreamBuilder adalah alat yang kuat dalam pengembangan aplikasi Flutter untuk mengintegrasikan data asinkron ke dalam tampilan antarmuka pengguna secara responsif.