Pembangunan Aplikasi Mudah Alih Flutter · Pelajaran

Strim dan Data Reaktif

Pelajari cara bekerja dengan Dart Streams dalam Flutter untuk mengendalikan data tak segerak berterusan seperti kemas kini langsung, soket dan UI reaktif.

Pelajaran 4 daripada 413 langkah

Strim dan Data Reaktif ialah pelajaran Pembangunan Aplikasi Mudah Alih Flutter percuma di CoddyKit. Ini ialah pelajaran 4 daripada 4. Sebanyak 3 pelajaran dalam laluan pembelajaran ini boleh dibaca sepenuhnya secara percuma — selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan praktikal dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Pelajaran ini merupakan sebahagian daripada laluan pembelajaran Pembangunan Aplikasi Mudah Alih Flutter, dan kemajuan anda disegerakkan merentas web serta aplikasi CoddyKit. Kursus Pembangunan Aplikasi Mudah Alih Flutter merangkumi sejumlah 4 pelajaran.

Melangkaui Future Tunggal

Future memberikan anda satu nilai kemudian. Stream memberikan anda banyak nilai dari semasa ke semasa.

Mesej WebSocket
Bacaan penderia
Kemas kini pangkalan data secara langsung

Strim ialah tulang belakang reaktif bagi Dart tak segerak.

Mendengar Strim

Langgan strim dengan listen, sambil membekalkan panggilan balik untuk data, ralat dan penyelesaian.

stream.listen(
  (data) => print('Got: ' + data.toString()),
  onError: (e) => print('Error: ' + e.toString()),
  onDone: () => print('Done'),
);

Mencipta Strim dengan async*

Penjana tak segerak menggunakan async* dan yield untuk mengeluarkan nilai.

Stream<int> countTo(int n) async* {
  for (var i = 1; i <= n; i++) {
    await Future.delayed(const Duration(seconds: 1));
    yield i;
  }
}

await for

Dalam fungsi tak segerak, anda boleh mengulangi strim dengan await for dan memproses setiap nilai sebaik sahaja nilai itu tiba.

Future<void> run() async {
  await for (final value in countTo(3)) {
    print(value);
  }
}

Tunggal berbanding Siaran

Strim langganan tunggal membenarkan satu pendengar. Strim siaran membenarkan banyak pendengar. Tukarkannya dengan asBroadcastStream().

final broadcast = controller.stream.asBroadcastStream();
broadcast.listen((v) => print('A: ' + v.toString()));
broadcast.listen((v) => print('B: ' + v.toString()));

StreamController

StreamController membolehkan anda menolak nilai ke dalam strim daripada kod anda sendiri.

final controller = StreamController<String>();
controller.add('hello');
controller.add('world');
controller.close();

Mengubah Strim

Strim mempunyai operator berfungsi seperti map, where dan take.

stream
  .where((n) => n.isEven)
  .map((n) => n * 10)
  .take(5)
  .listen(print);

Widget StreamBuilder

Dalam UI, StreamBuilder membina semula UI setiap kali strim mengeluarkan nilai baharu.

StreamBuilder<int>(
  stream: countTo(5),
  builder: (context, snapshot) {
    if (!snapshot.hasData) return const CircularProgressIndicator();
    return Text('Value: ' + snapshot.data.toString());
  },
);

Membaca Snapshot

AsyncSnapshot memberitahu anda keadaan sambungan serta sama ada data atau ralat tersedia.

snapshot.connectionState
snapshot.hasData / snapshot.data
snapshot.hasError / snapshot.error

if (snapshot.hasError) return Text('Error: ' + snapshot.error.toString());

Membatalkan Langganan

Sentiasa batalkan langganan dalam dispose untuk mengelakkan kebocoran memori.

late StreamSubscription sub;

@override
void dispose() {
  sub.cancel();
  super.dispose();
}

Tekanan Balik dan Ralat

Strim boleh mengeluarkan ralat di pertengahan aliran. Kendalikannya dengan handleError supaya satu peristiwa bermasalah tidak menghentikan keseluruhan saluran pemprosesan.

stream
  .handleError((e) => print('Skipped: ' + e.toString()))
  .listen(print);

Semakan Pantas

Widget manakah yang membina semula UI anda secara automatik apabila strim mengeluarkan nilai baharu?

Jawab dalam pelajaran interaktif

Imbas Kembali

Anda telah mempelajari cara bekerja dengan Streams:

async* / yield dan StreamController untuk menciptanya
map / where / take untuk mengubahnya
StreamBuilder untuk menggerakkan UI reaktif
Membatalkan langganan dan mengendalikan ralat

Strim membolehkan aplikasi anda bertindak balas terhadap data tak segerak yang berterusan dalam masa nyata.

Percuma untuk bermula

Pelajari Dart dengan tutor kecerdasan buatan — percuma

Tulis dan jalankan kod sebenar dalam pelayar anda, dapatkan bantuan segera daripada tutor kecerdasan buatan yang tersedia 24/7, dan sambung semula dari tempat anda berhenti di web atau dalam aplikasi.

Kursus: 22
Pelajaran: 88

Mula belajar secara percuma Lihat kursus penuh

Soalan Lazim

Adakah pelajaran “Strim dan Data Reaktif” percuma?

Ya — sebanyak 3 pelajaran dalam laluan pembelajaran Pembangunan Aplikasi Mudah Alih Flutter, termasuk “Strim dan Data Reaktif”, boleh dibaca sepenuhnya secara percuma di web ini. Selepas itu, CoddyKit PRO membuka akses kepada semua pelajaran, serta latihan interaktif dengan penyunting kod terbina dalam dan tutor kecerdasan buatan yang tersedia 24/7. Kursus Pembangunan Aplikasi Mudah Alih Flutter merangkumi sejumlah 4 pelajaran.

Apakah yang akan saya pelajari dalam “Strim dan Data Reaktif”?

Pelajari cara bekerja dengan Dart Streams dalam Flutter untuk mengendalikan data tak segerak berterusan seperti kemas kini langsung, soket dan UI reaktif. Anda berlatih Pembangunan Aplikasi Mudah Alih Flutter menggunakan kod praktikal yang dijalankan terus dalam pelayar, manakala tutor kecerdasan buatan 24/7 menjawab soalan anda semasa anda mengikuti pelajaran.

Adakah saya memerlukan pengalaman untuk memulakan Pembangunan Aplikasi Mudah Alih Flutter?

Tiada pengalaman terdahulu diperlukan. Pembelajaran Pembangunan Aplikasi Mudah Alih Flutter di CoddyKit disusun untuk pelajar daripada peringkat pemula hingga lanjutan, jadi anda boleh bermula di sini atau dari awal dan belajar mengikut kadar anda sendiri. Ini ialah pelajaran 4 daripada 4.

Berapa lamakah pelajaran “Strim dan Data Reaktif” diambil?

Kebanyakan pelajaran CoddyKit mengambil masa kira-kira 5–10 minit. Setiap pelajaran ringkas dan interaktif, jadi anda boleh membuat kemajuan secara berterusan dan menyambung tepat dari tempat anda berhenti di web atau aplikasi.

Bolehkah saya menulis dan menjalankan kod dalam pelajaran Pembangunan Aplikasi Mudah Alih Flutter ini?

Ya. Setiap pelajaran Pembangunan Aplikasi Mudah Alih Flutter menyertakan penyunting kod terbina dalam, jadi anda boleh menulis dan menjalankan kod sebenar terus dalam pelayar serta menerima maklum balas kecerdasan buatan serta-merta — tanpa memerlukan persediaan setempat.

Semua pelajaran dalam kursus ini

Future dan Async/Await
Permintaan HTTP dan JSON
Pengendalian Ralat dalam Operasi Tak Segerak
Strim dan Data Reaktif

← Kembali ke Pembangunan Aplikasi Mudah Alih Flutter