Widgets a partir de datos con map

Parte de la sección Listas y pantallas del Journey de Flutter de Coddy. Lección 15 de 33.

El map de una lista crea una lista nueva al ejecutar una función en cada elemento. Así conviertes una lista de datos en una lista de widgets:

ListView(
  children: books.map((book) => ListTile(title: Text(book.title))).toList(),
)

(book) => ListTile(...) es una función breve: recibe un book y devuelve el mosaico después de la flecha. map la llama para cada libro, en orden.

map todavía no devuelve un List, así que termina con .toList(): children: necesita una lista. Un for de colección hace lo mismo. Usa el que te resulte más fácil de leer; verás ambos en aplicaciones reales.

map también convierte datos en otros datos: books.map((book) => book.title).toList() es un List<String> de los títulos.

Desafío

Fácil

La lista tiene cinco libros, pero la pantalla muestra tres elementos escritos a mano. Reemplaza los tres elementos por books.map(...).toList(), para que cada libro tenga un elemento con su título y su autor como subtítulo.

Pruébalo tú mismo

import 'package:flutter/material.dart';

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

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

  @override
  Widget build(BuildContext context) {
    final List<Book> books = [
      Book('Dune', 'Frank Herbert'),
      Book('Emma', 'Jane Austen'),
      Book('Ulysses', 'James Joyce'),
      Book('Coraline', 'Neil Gaiman'),
      Book('Beloved', 'Toni Morrison'),
    ];
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(title: const Text('Books')),
        body: ListView(
          children: [
            ListTile(
              title: Text(books[0].title),
              subtitle: Text(books[0].author),
            ),
            ListTile(
              title: Text(books[1].title),
              subtitle: Text(books[1].author),
            ),
            ListTile(
              title: Text(books[2].title),
              subtitle: Text(books[2].author),
            ),
          ],
        ),
      ),
    );
  }
}

class Book {
  final String title;
  final String author;

  Book(this.title, this.author);
}