Suma una lista con fold

Parte de la sección Gestión del estado del Journey de Flutter de Coddy. Lección 8 de 27.

Una lista de gastos necesita un total. Podrías recorrerla y sumar, pero una lista tiene un método que hace exactamente esto: fold. Recorre la lista y va llevando un valor de un elemento al siguiente:

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

Léelo así: empieza en 0.0. Por cada gasto e, el nuevo sum es el antiguo sum más e.amount. Cuando termina la lista, el último sum es el resultado. Para 3.5 y 12, eso es 0.0, después 3.5 y después 15.5.

La función debe devolver la nueva suma. Si devuelve solo e.amount, cada paso olvida el anterior y el «total» es el último precio.

La lista en sí puede cambiar: expenses.add(...) dentro de setState agrega uno más, y la siguiente compilación suma la nueva lista.

Desafío

Fácil

La línea del total siempre muestra $0.00. Calcúlalo en su lugar:

Establece total con expenses.fold, sumando el amount de cada gasto.

La línea ya lo muestra con 2 decimales, así que debería mostrar Total: $15.50 y aumentar cuando agregues un tentempié.

Pruébalo tú mismo

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'),
            ),
          ],
        ),
      ),
    );
  }
}