Gist of class M1S3 II of the UCamp Flutter BootCamp

M1S3II.dart

import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'package:intl/intl.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(brightness: Brightness.light),
      darkTheme: ThemeData(brightness: Brightness.dark),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  final String title;

  const MyHomePage({
    Key? key,
    required this.title,
  }) : super(key: key);

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    final theme = Theme.of(context);
    final textTheme = theme.textTheme;
    final colorScheme = theme.colorScheme;

    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: SingleChildScrollView(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            mainAxisSize: MainAxisSize.min,
            children: [
              CupertinoListTile(
                title: Text('Hola Mundo', style: textTheme.titleLarge),
                leading: const Icon(Icons.apple),
                trailing: const Icon(Icons.flutter_dash),
              ),
              const Divider(),
              ListTile(
                title: Text('Hola Mundo', style: textTheme.titleLarge),
                leading: const Icon(Icons.android),
                trailing: const Icon(Icons.flutter_dash),
                selectedColor: colorScheme.onPrimary,
              ),
              const Divider(),
              UCampListTile(
                senderName: 'Marco Ortiz',
                description:
                    'No hay ninguna técnica infalible para crear un correo electrónico, pero sí numerosas fuentes de inspiración útiles. Para ayudarte, hemos recopilado cinco ejemplos de diseños de email',
                leadingIcon: Icons.school,
                trailingIcon: Icons.flutter_dash,
                dateEmail: DateTime.now(),
              ),
              const Divider(),
              UCampListTile(
                senderName: 'Marco Ortiz',
                description:
                    'No hay ninguna técnica infalible para crear un correo electrónico, pero sí numerosas fuentes de inspiración útiles. Para ayudarte, hemos recopilado cinco ejemplos de diseños de email',
                leadingIcon: Icons.school,
                trailingIcon: Icons.flutter_dash,
                dateEmail: DateTime.now(),
              ),
              const Divider(),
              UCampListTile(
                senderName: 'Marco Ortiz',
                description:
                    'No hay ninguna técnica infalible para crear un correo electrónico, pero sí numerosas fuentes de inspiración útiles. Para ayudarte, hemos recopilado cinco ejemplos de diseños de email',
                leadingIcon: Icons.school,
                trailingIcon: Icons.flutter_dash,
                dateEmail: DateTime.now(),
              ),
              const Divider(),
              UCampListTile(
                senderName: 'Marco Ortiz',
                description:
                    'No hay ninguna técnica infalible para crear un correo electrónico, pero sí numerosas fuentes de inspiración útiles. Para ayudarte, hemos recopilado cinco ejemplos de diseños de email',
                leadingIcon: Icons.school,
                trailingIcon: Icons.flutter_dash,
                dateEmail: DateTime.now(),
              ),
              const Divider(),
              UCampListTile(
                senderName: 'Marco Ortiz',
                description:
                    'No hay ninguna técnica infalible para crear un correo electrónico, pero sí numerosas fuentes de inspiración útiles. Para ayudarte, hemos recopilado cinco ejemplos de diseños de email',
                leadingIcon: Icons.school,
                trailingIcon: Icons.flutter_dash,
                dateEmail: DateTime.now(),
              ),
              const Divider(),
              UCampListTile(
                senderName: 'Marco Ortiz',
                description:
                    'No hay ninguna técnica infalible para crear un correo electrónico, pero sí numerosas fuentes de inspiración útiles. Para ayudarte, hemos recopilado cinco ejemplos de diseños de email',
                leadingIcon: Icons.school,
                trailingIcon: Icons.flutter_dash,
                dateEmail: DateTime.now(),
              ),
              const Divider(),
              UCampListTile(
                senderName: 'Fernando Gonzalez',
                description: 'Subtitle UCampListTile',
                leadingIcon: Icons.school,
                trailingIcon: Icons.flutter_dash,
                imageUrl:
                    'https://marketplace.canva.com/EAE6OJ2qP8U/1/0/1600w/canva-gamer-with-glasses-character-twitch-profile-picture-CVfgWIJGgRo.jpg',
                dateEmail: DateTime(2017, 9, 7, 17, 30).toLocal(),
              ),
            ],
          ),
        ),
      ),
      floatingActionButton: FloatingActionButton.extended(
        icon: const Icon(Icons.create_outlined),
        onPressed: () {
          ScaffoldMessenger.of(context).showSnackBar(
              const SnackBar(content: Text('Clic in FloatingActionButton')));
        },
        label: const Text('Redactar'),
      ),
    );
  }
}

class UCampListTile extends StatelessWidget {
  const UCampListTile({
    super.key,
    required this.senderName,
    required this.description,
    required this.leadingIcon,
    required this.trailingIcon,
    this.imageUrl,
    required this.dateEmail,
  });

  final String senderName;
  final String description;
  final IconData leadingIcon;
  final IconData trailingIcon;
  final String? imageUrl;
  final DateTime dateEmail;

  @override
  Widget build(BuildContext context) {
    final theme = Theme.of(context);
    final textTheme = theme.textTheme;

    // DateTime now = DateTime.now();
    String dateString = DateFormat('HH:mm').format(dateEmail);

    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 16.0),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Container(
            alignment: Alignment.center,
            child: CircleAvatar(
              backgroundImage:
                  imageUrl != null ? NetworkImage(imageUrl!) : null,
              child: imageUrl != null
                  ? const SizedBox()
                  : Text(senderName.characters.first),
            ),
          ),
          const SizedBox(width: 16),
          Expanded(
            child: Column(
              mainAxisSize: MainAxisSize.min,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  senderName,
                  style: textTheme.titleLarge,
                  textAlign: TextAlign.start,
                  maxLines: 1,
                ),
                Text(
                  description,
                  style: textTheme.titleMedium,
                  textAlign: TextAlign.start,
                  maxLines: 2,
                ),
              ],
            ),
          ),
          Container(
            width: 50,
            alignment: Alignment.center,
            padding: const EdgeInsets.all(2),
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: [Text(dateString), const Icon(Icons.star)],
            ),
          ),
        ],
      ),
    );
  }
}