Nilai yang Tiba Nanti

Termasuk bagian Data dan Jaringan dalam perjalanan Flutter di Coddy. Pelajaran 1 dari 27.

Sampai sekarang, semua yang terjadi di aplikasimu berlangsung sekaligus: ketuk tombol, layar berubah. Aplikasi sungguhan sering menunggu. Aplikasi menunggu jawaban dari server, file dimuat, atau timer habis.

Dart menyebut nilai yang belum tersedia sebagai Future. Yang paling sederhana adalah Future.delayed: kode ini menunggu selama Duration, lalu menjalankan fungsi yang kamu berikan.

Future.delayed(const Duration(seconds: 2), () {
  setState(() {
    message = 'Done';
  });
});

Aplikasimu tidak membeku saat menunggu. Layar terus digambar dan tombol tetap berfungsi. Setelah 2 detik berlalu, Dart menjalankan fungsi tersebut, lalu setState menggambar ulang layar dengan pesan baru.

Tantangan

Mudah

Mengetuk Boil water langsung menampilkan Tea is ready. Air membutuhkan waktu untuk mendidih. Ubah pesan 3 seconds setelah ketukan, dengan Future.delayed.

Coba sendiri

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      debugShowCheckedModeBanner: false,
      home: TeaScreen(),
    );
  }
}

class TeaScreen extends StatefulWidget {
  const TeaScreen({super.key});

  @override
  State<TeaScreen> createState() => _TeaScreenState();
}

class _TeaScreenState extends State<TeaScreen> {
  String message = 'The water is cold';

  void boil() {
    setState(() {
      message = 'Tea is ready';
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text(message, style: const TextStyle(fontSize: 28)),
            const SizedBox(height: 24),
            ElevatedButton(onPressed: boil, child: const Text('Boil water')),
          ],
        ),
      ),
    );
  }
}

Uji dirimu

Pelajaran ini berisi kuis singkat. Mulai pelajarannya untuk menjawab kuis dan melacak progresmu.

Semua pelajaran di Data dan Jaringan

Latihan sendiri: Compiler Flutter online