Cantos arredondados

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

Para usar algo além de uma cor simples, um Container recebe um decoration:. Um BoxDecoration pode arredondar os cantos:

Container(
  padding: EdgeInsets.all(16),
  decoration: BoxDecoration(
    color: Colors.indigo,
    borderRadius: BorderRadius.circular(12),
  ),
  child: Text('Rounded'),
)

BorderRadius.circular(12) arredonda todos os cantos com uma curva de 12 pixels de largura.

Observe que color: foi movido para dentro de BoxDecoration. Um Container não pode ter tanto color: quanto decoration:: o Flutter para e exibe um erro, porque não consegue determinar qual cor você quer.

Desafio

Fácil

Arredonde os cantos da caixa rosa:

substitua o color: do Container por um decoration:
faça dele um BoxDecoration com color: Colors.pink e borderRadius: BorderRadius.circular(16)

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(
            padding: EdgeInsets.all(16),
            color: Colors.pink,
            child: Text('Sale', style: TextStyle(fontSize: 32, color: Colors.white)),
          ),
        ),
      ),
    );
  }
}