Alinear los bordes izquierdos

Parte de la sección Tu primera app del Journey de Flutter de Coddy. Lección 23 de 32.

La otra dirección de una Column, a lo ancho, es su eje transversal. De forma predeterminada, cada elemento secundario está centrado a lo ancho de la columna, por lo que una línea corta y una larga no empiezan en el mismo lugar.

crossAxisAlignment: cambia eso:

Column(
  crossAxisAlignment: CrossAxisAlignment.start,
  children: [...],
)

En una Column, CrossAxisAlignment.start alinea los elementos secundarios a la izquierda, end a la derecha, y center es el valor predeterminado.

Desafío

Fácil

Haz que ambas líneas empiecen en el mismo borde izquierdo, con crossAxisAlignment: de la columna.

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) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: Column(
            children: [
              Text('Name', style: TextStyle(fontSize: 24)),
              Text('A much longer line', style: TextStyle(fontSize: 24)),
            ],
          ),
        ),
      ),
    );
  }
}