Sumowanie listy za pomocą fold

Część sekcji Zarządzanie stanem ścieżki Flutter w Coddy. Lekcja 8 z 27.

Lista wydatków wymaga zsumowania. Możesz użyć pętli i dodawać wartości, ale lista ma metodę, która robi dokładnie to: fold. Przechodzi przez listę, przenosząc jedną wartość od elementu do elementu:

double total = expenses.fold(0.0, (sum, e) => sum + e.amount);

Czytaj to tak: zacznij od 0.0. Dla każdego wydatku e nowa wartość sum to poprzednia wartość sum plus e.amount. Gdy lista zostanie przetworzona, ostatnia wartość sum będzie wynikiem. Dla 3.5 i 12 są to kolejno: 0.0, potem 3.5, a następnie 15.5.

Funkcja musi zwrócić nową sumę. Jeśli zwróci tylko e.amount, każdy krok zapomni o poprzednim, a „suma” będzie ostatnią ceną.

Sama lista może się zmieniać: expenses.add(...) wewnątrz setState dodaje kolejny element, a podczas następnego budowania sumowana jest nowa lista.

Wyzwanie

Łatwy

Wiersz z sumą zawsze pokazuje $0.00. Oblicz ją zamiast tego:

Ustaw total za pomocą expenses.fold, dodając kwotę każdego wydatku: amount.

Wiersz już wyświetla sumę z 2 miejscami po przecinku, więc powinien pokazywać Total: $15.50 i zwiększyć się po dodaniu przekąski.

Spróbuj swoich sił

import 'package:flutter/material.dart';

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

class Expense {
  Expense({required this.name, required this.amount});

  final String name;
  final double 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 List<Expense> expenses = [
    Expense(name: 'Coffee', amount: 3.5),
    Expense(name: 'Lunch', amount: 12),
  ];

  @override
  Widget build(BuildContext context) {
    double total = 0;
    return Scaffold(
      appBar: AppBar(title: const Text('Expenses')),
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            for (final e in expenses) Text('${e.name}: \$${e.amount.toStringAsFixed(2)}'),
            const SizedBox(height: 16),
            Text('Total: \$${total.toStringAsFixed(2)}', style: const TextStyle(fontSize: 28)),
            const SizedBox(height: 16),
            ElevatedButton(
              onPressed: () {
                setState(() {
                  expenses.add(Expense(name: 'Snack', amount: 2.25));
                });
              },
              child: const Text('Add a snack'),
            ),
          ],
        ),
      ),
    );
  }
}