Getter trong lớp của bạn

Thuộc phần Quản lý trạng thái trong hành trình Flutter của Coddy. Bài học 6 trên 27.

Một số giá trị không cần lưu lại vì chúng được tính từ những giá trị khác. Số ly còn lại bằng mục tiêu trừ đi số ly đã uống. Getter sẽ tính giá trị đó mỗi khi bạn cần:

class WaterLog {
  int glasses = 0;
  int goal = 8;

  int get left => goal - glasses;
  bool get done => glasses >= goal;
}

Getter có kiểu dữ liệu, từ get và tên, không có dấu ngoặc đơn. => có nghĩa là “kết quả là”. Bạn đọc getter như một trường: log.left, không phải log.left().

Trường sẽ giữ nguyên con số từ lúc được gán. Getter tính lại giá trị mỗi lần đọc, nên giá trị luôn cập nhật: uống một ly thì ở lần dựng tiếp theo, log.left giảm đi một.

Thử thách

Dễ

Trang tự tính toán, và khi đạt mục tiêu thì số ly sẽ xuống dưới không. Chuyển các quy tắc vào WaterLog:

Thêm getter left: mục tiêu trừ số ly đã uống.
Thêm getter done: trả về true khi số ly đạt mục tiêu.
Hiển thị Goal reached! khi log.done là đúng, nếu không thì hiển thị 8 to go, 7 to go và tiếp tục như vậy dựa trên log.left.

Tự làm thử

import 'package:flutter/material.dart';

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

class WaterLog {
  int glasses = 0;
  int goal = 8;

  void drink() {
    glasses = glasses + 1;
  }
}

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

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

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

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  final log = WaterLog();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Water')),
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text(
              '${log.goal - log.glasses} to go',
              style: const TextStyle(fontSize: 32),
            ),
            const SizedBox(height: 16),
            ElevatedButton(
              onPressed: () {
                setState(() {
                  log.drink();
                });
              },
              child: const Text('Drink a glass'),
            ),
          ],
        ),
      ),
    );
  }
}