הפכו שדה לפרטי

חלק מהיחידה ניהול מצב במסלול ה-Flutter של Coddy. שיעור 7 מתוך 27.

תרמוסטט לעולם לא אמור להיות מעל 26 או מתחת ל־16 מעלות. מתודה warmer יכולה לבדוק זאת, אבל רק אם אף אחד לא יכול לשנות את המספר בדרך אחרת. כל עוד השדה ציבורי, כל קוד יכול לכתוב thermostat.degrees = 99.

שם שמתחיל ב־_ הוא פרטי: רק קוד באותו קובץ יכול להשתמש בו. שים את המחלקה בקובץ משלה, הפוך את השדה לפרטי ותן לקוד שמחוץ למחלקה getter כדי לקרוא אותו ומתודות כדי לשנות אותו:

// thermostat.dart
class Thermostat {
  int _degrees = 20;

  int get degrees => _degrees;

  void warmer() {
    if (_degrees < 26) {
      _degrees = _degrees + 1;
    }
  }
}

הדף מייבא את הקובץ באמצעות import 'thermostat.dart';. אפשר לקרוא את thermostat.degrees, אבל thermostat.degrees++ כבר לא מתקמפל: יש getter ואין דרך להציב בו ערך. הדרך היחידה לשנות את המעלות היא באמצעות המתודות, ולכן המגבלות תמיד נשמרות.

פתח את thermostat.dart ברשימת הקבצים כדי לערוך אותו.

אתגר

בינוני

הכפתורים משנים את degrees ישירות מהדף, ללא הגבלות. בקובץ thermostat.dart:

שנה את שם השדה ל־_degrees והוסף getter בשם degrees שמחזיר אותו.
הוסף את warmer(), שמעלה ב־1 עד 26, ואת cooler(), שמורידה ב־1 עד 16.

לאחר מכן, הגדר את הכפתורים בקובץ main.dart כך שיקראו ל־thermostat.warmer() ול־thermostat.cooler().

נסו בעצמכם

import 'package:flutter/material.dart';

import 'thermostat.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: HomePage(),
    );
  }
}

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

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

class _HomePageState extends State<HomePage> {
  final thermostat = Thermostat();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Thermostat')),
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text('${thermostat.degrees}°C', style: const TextStyle(fontSize: 48)),
            const SizedBox(height: 16),
            Row(
              mainAxisSize: MainAxisSize.min,
              children: [
                ElevatedButton(
                  onPressed: () {
                    setState(() {
                      thermostat.degrees--;
                    });
                  },
                  child: const Text('Cooler'),
                ),
                const SizedBox(width: 16),
                ElevatedButton(
                  onPressed: () {
                    setState(() {
                      thermostat.degrees++;
                    });
                  },
                  child: const Text('Warmer'),
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}