🧑‍🏫04. List

List в программировании — это способ хранить несколько значений в одном месте. Представь, что у тебя есть коробка, в которую можно положить много разных предметов, и когда тебе что-то нужно, ты просто достаешь это из коробки. List — это та же коробка, но для хранения данных.

Зачем нужен List?

List помогает нам работать с большим количеством элементов, не создавая множество отдельных переменных. Например, если у нас есть список покупок (яблоки, бананы, молоко), вместо того, чтобы создавать переменные для каждого элемента, мы можем объединить их в один List.

Как создать List в Dart

В Dart есть несколько способов создать List, в зависимости от того, нужен ли список с определенными элементами или пустой список, в который мы будем добавлять элементы позже.

Пример создания List

// Создаем пустой список, который мы сможем заполнять позже
List<String> shoppingList = [];

// Создаем список сразу с элементами
List<int> numbers = [1, 2, 3, 4, 5];

// Используем var — Dart сам поймет тип данных
var fruits = ['Яблоко', 'Банан', 'Апельсин'];

---

Пример использования List в Flutter

Представим, что у нас есть приложение для отображения списка дел. Мы создадим List с элементами и будем показывать их на экране.

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: TaskApp(),
    );
  }
}

class TaskApp extends StatefulWidget {
  @override
  _TaskAppState createState() => _TaskAppState();
}

class _TaskAppState extends State<TaskApp> {
  List<String> tasks = [];  // Список задач
  String searchQuery = '';  // Строка поиска

  // Функция для отображения диалогового окна
  Future<void> showTaskDialog({
    required BuildContext context,
    String? currentTask,
    required String title,
    required Function(String) onConfirm,
  }) async {
    TextEditingController controller = TextEditingController(text: currentTask);
    await showDialog(
      context: context,
      builder: (context) {
        return AlertDialog(
          title: Text(title),
          content: TextField(
            controller: controller,
            decoration: InputDecoration(hintText: 'Введите задачу'),
          ),
          actions: [
            TextButton(
              onPressed: () => Navigator.of(context).pop(),
              child: Text('Отмена'),
            ),
            ElevatedButton(
              onPressed: () {
                onConfirm(controller.text);
                Navigator.of(context).pop();
              },
              child: Text('Сохранить'),
            ),
          ],
        );
      },
    );
  }

  // Добавление задачи
  void addTask(String task) {
    setState(() {
      tasks.add(task);
    });
  }

  // Удаление задачи
  void deleteTask(int index) {
    setState(() {
      tasks.removeAt(index);
    });
  }

  // Обновление задачи
  void updateTask(int index, String newTask) {
    setState(() {
      tasks[index] = newTask;
    });
  }

  // Поиск задач по введенному запросу
  List<String> getFilteredTasks() {
    return tasks
        .where((task) => task.toLowerCase().contains(searchQuery.toLowerCase()))
        .toList();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Task App'),
        actions: [
          // Поисковая строка
          IconButton(
            icon: Icon(Icons.search),
            onPressed: () {
              showTaskDialog(
                context: context,
                title: 'Поиск задачи',
                onConfirm: (query) {
                  setState(() {
                    searchQuery = query;
                  });
                },
              );
            },
          ),
        ],
      ),
      body: ListView.builder(
        itemCount: getFilteredTasks().length,
        itemBuilder: (context, index) {
          final task = getFilteredTasks()[index];
          return ListTile(
            title: Text(task),
            trailing: Row(
              mainAxisSize: MainAxisSize.min,
              children: [
                IconButton(
                  icon: Icon(Icons.edit),
                  onPressed: () {
                    showTaskDialog(
                      context: context,
                      currentTask: task,
                      title: 'Редактировать задачу',
                      onConfirm: (newTask) => updateTask(index, newTask),
                    );
                  },
                ),
                IconButton(
                  icon: Icon(Icons.delete),
                  onPressed: () => deleteTask(index),
                ),
              ],
            ),
          );
        },
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          showTaskDialog(
            context: context,
            title: 'Добавить задачу',
            onConfirm: addTask,
          );
        },
        child: Icon(Icons.add),
      ),
    );
  }
}

Объяснение кода:

1. Структура TaskApp:

   • Используем List<String> для хранения списка задач.

   • searchQuery — строка для хранения текущего поискового запроса.

2. Функция showTaskDialog:

   • Вызывает AlertDialog с текстовым полем для ввода задачи.

   • Принимает название диалога (title), текущий текст задачи (currentTask, если он есть) и функцию обратного вызова (onConfirm), которая выполняется при подтверждении.

3. Функции addTask, deleteTask, updateTask:

   • addTask добавляет задачу в конец списка.

   • deleteTask удаляет задачу по индексу.

   • updateTask обновляет задачу по индексу.

4. Функция getFilteredTasks:

   • Возвращает задачи, которые соответствуют текущему searchQuery.

   • Фильтрация происходит через метод where, который проверяет вхождение строки поиска в каждой задаче.

5. Интерфейс с ListView.builder:

   • Используется для отображения задач из getFilteredTasks.

   • Каждая задача имеет кнопки для редактирования и удаления, работающие через showTaskDialog.

6. Поиск задачи:

   • Поисковая строка вызывается через иконку поиска в AppBar.

   • showTaskDialog используется для ввода текста поиска, который обновляет searchQuery и вызывает setState для обновления экрана.

7. Кнопка добавления задачи:

   • Кнопка FloatingActionButton открывает диалог добавления задачи, вызывая addTask с введенным текстом.