רשימת משימות: רשימת המטלות

חלק מהיחידה פרויקטים במסלול ה-Flutter של Coddy. שיעור 1 מתוך 36.

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

האפליקציה הראשונה היא רשימת משימות. בסוף הפרק הזה תוכל להוסיף משימות, לסמן אותן כהושלמו, להחליק אותן הצידה, לבטל מחיקה ולסנן את מה שמוצג.

כל אפליקציה מתחילה בנתונים שלה. לעת עתה, משימה היא כותרת, לכן מחלקה קטנה מכילה אותה, והמסך שומר רשימת משימות ב-State שלה:

class Task {
  Task(this.title);

  final String title;
}

final List<Task> _tasks = [Task('Buy milk')];

ListView.builder הופך את הרשימה הזאת לשורות במסך. הוא קורא ל-itemBuilder פעם אחת עבור כל אינדקס עד itemCount, וכל קריאה מחזירה ListTile אחד.

אתגר

קל

הציגו את המשימות:

כתבו מחלקה בשם Task עם final String title ובנאי Task(this.title)
בתוך _TodoScreenState, צרו רשימה בשם _tasks עם שלוש משימות: Buy milk, Walk the dog ו־Read a book
החליפו את Center שבתוך body: ב־ListView.builder שמציג את הכותרת של כל משימה בתוך ListTile

נסו בעצמכם

import 'package:flutter/material.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.teal),
      ),
      home: const TodoScreen(),
    );
  }
}

// כתבו כאן את המחלקה Task.

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

  @override
  State<TodoScreen> createState() => _TodoScreenState();
}

class _TodoScreenState extends State<TodoScreen> {
  // צרו כאן את רשימת המשימות.

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('My Tasks')),
      body: const Center(
        child: Text('Your tasks go here'),
      ),
    );
  }
}