Additionner une liste avec fold

Fait partie de la section Gestion d’état du Journey Flutter de Coddy. Leçon 8 sur 27.

Une liste de dépenses a besoin d’un total. Tu pourrais parcourir la liste et additionner les valeurs, mais une liste possède une méthode qui fait exactement cela : fold. Elle parcourt la liste en transportant une valeur d’un élément à l’autre :

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

Lis-le ainsi : commence à 0.0. Pour chaque dépense e, le nouveau sum est l’ancien sum plus e.amount. Quand la liste est parcourue, le dernier sum est le résultat. Pour 3.5 et 12, cela donne 0.0, puis 3.5, puis 15.5.

La fonction doit renvoyer la nouvelle somme. Si elle renvoie uniquement e.amount, chaque étape oublie la précédente, et le « total » correspond au dernier prix.

La liste elle-même peut changer : expenses.add(...) dans setState en ajoute un élément, et la prochaine reconstruction additionne la nouvelle liste.

Défi

Facile

La ligne du total indique toujours $0.00. Calculez-le plutôt :

Définissez total avec expenses.fold, en additionnant le amount de chaque dépense.

La ligne l’affiche déjà avec 2 décimales ; elle devrait donc indiquer Total: $15.50 et augmenter lorsque vous ajoutez une collation.

Essayez vous-même

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