Relleno

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

Una caja que se ajusta a su texto se ve apretada. padding: agrega espacio dentro de la caja, entre su borde y su hijo:

Container(
  padding: EdgeInsets.all(16),
  color: Colors.yellow,
  child: Text('Room to breathe'),
)

EdgeInsets.all(16) significa 16 píxeles en los cuatro lados. EdgeInsets.symmetric(horizontal: 24, vertical: 8) establece por separado los lados y la parte superior e inferior.

Un Container también tiene margin:. Eso es espacio fuera de la caja, entre esta y sus elementos vecinos. La parte coloreada no crece.

Desafío

Fácil

Dale un poco de espacio a Fresh: añade 24 píxeles de relleno en cada lado, dentro del cuadro verde.

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: Container(
            color: Colors.lightGreen,
            child: Text('Fresh', style: TextStyle(fontSize: 32)),
          ),
        ),
      ),
    );
  }
}