Menu
CoddyTech

Preenchimento

Parte da seção Seu primeiro app do Journey de Flutter da Coddy. Lição 17 de 32.

Uma caixa que fica rente ao texto parece apertada. padding: adiciona espaço dentro da caixa, entre sua borda e seu filho:

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

EdgeInsets.all(16) significa 16 pixels em todos os quatro lados. EdgeInsets.symmetric(horizontal: 24, vertical: 8) define separadamente os lados e a parte superior e inferior.

Um Container também tem margin:. Esse é o espaço fora da caixa, entre ela e os elementos vizinhos. A parte colorida não aumenta.

challenge icon

Desafio

Fácil

Dê um pouco de espaço para Fresh: adicione 24 pixels de preenchimento em todos os lados, dentro da caixa verde.

Experimente você mesmo

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)),
          ),
        ),
      ),
    );
  }
}
quiz iconTeste seus conhecimentos

Esta lição inclui um quiz rápido. Comece a lição para respondê-lo e acompanhar seu progresso.

Todas as lições de Seu primeiro app

Pratique por conta própria: Compilador de Flutter online