Menu
CoddyTech

מתודות במחלקות שלכם

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

עד כה המחלקות שלך הכילו נתונים: שם, מחיר. מחלקה יכולה להכיל גם קוד שמשנה את הנתונים האלה. פונקציה בתוך מחלקה נקראת מתודה:

class Wallet {
  int coins = 10;

  void earn(int amount) {
    coins = coins + amount;
  }
}

קוראים למתודה באמצעות נקודה, כמו לשדה: wallet.earn(3). בתוך המתודה, coins הוא השדה של הארנק שעליו היא נקראה.

למה לטרוח, אם הדף יכול לכתוב בעצמו wallet.coins = wallet.coins + 3? כי כך הכללים נמצאים במקום אחד. אם אסור לארנק לרדת אף פעם מתחת לאפס, המתודה spend בודקת זאת, וכל כפתור שמבצע הוצאה עובר דרך הבדיקה הזאת.

הווידג׳ט עדיין קורא ל־setState מסביב לקריאה, כדי שהמסך יציג את המספר החדש.

challenge icon

אתגר

קל

כרגע Spend 5 מוריד מטבעות ישירות מהשדה, והארנק יורד מתחת לאפס.

  • הוסף ל־Wallet מתודה void spend(int amount) שמורידה את המטבעות רק כשיש מספיק.
  • גרום לכפתור Spend 5 לקרוא ל־wallet.spend(5) בתוך setState.

נסו בעצמכם

import 'package:flutter/material.dart';

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

class Wallet {
  int coins = 10;

  void earn(int amount) {
    coins = coins + amount;
  }
}

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 wallet = Wallet();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Wallet')),
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text('${wallet.coins} coins', style: const TextStyle(fontSize: 32)),
            const SizedBox(height: 16),
            ElevatedButton(
              onPressed: () {
                setState(() {
                  wallet.earn(3);
                });
              },
              child: const Text('Earn 3'),
            ),
            ElevatedButton(
              onPressed: () {
                setState(() {
                  wallet.coins = wallet.coins - 5;
                });
              },
              child: const Text('Spend 5'),
            ),
          ],
        ),
      ),
    );
  }
}
quiz iconבחנו את עצמכם

השיעור הזה כולל חידון קצר. התחילו את השיעור כדי לענות עליו ולעקוב אחרי ההתקדמות.

כל השיעורים ביחידה ניהול מצב

תרגלו בעצמכם: קומפיילר Flutter אונליין