Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Projeto] Faça como eu fiz

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(
          backgroundColor: Colors.black,
          title: const Text(
            "Flutter: Primeiros Passos",
            style: TextStyle(color: Colors.yellowAccent),
          ),
        ),
        body: Container(
          color: Colors.yellow,
          child: ListView(
            children: const [
              Padding(
                padding: EdgeInsets.all(8.0),
                child: Cardtest(Colors.pink, Colors.orange, Colors.cyan, 100,
                    Icons.mobile_friendly),
              ),
              Cardtest(Colors.deepPurple, Colors.green, Colors.lime, 100,
                  Icons.access_time),
              Cardtest(Colors.brown, Colors.teal, Colors.red, 100,
                  Icons.accessibility_new_rounded),
              Cardtest(
                  Colors.purple,
                  Color.fromARGB(255, 183, 255, 248),
                  Color.fromARGB(255, 74, 12, 148),
                  100,
                  Icons.sports_soccer_sharp)
            ],
          ),
        ),
      ),
    );
  }
}

class Cardtest extends StatelessWidget {
  final Color cor1;
  final Color cor2;
  final Color cor3;
  final double largura;
  final IconData icone;
  const Cardtest(this.cor1, this.cor2, this.cor3, this.largura, this.icone,
      {super.key});

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: SizedBox(
        height: 140,
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Container(
              height: 140,
              width: largura,
              decoration: BoxDecoration(
                border: Border.all(color: Colors.black, width: 3),
                borderRadius: BorderRadius.circular(20),
                color: cor1,
              ),
            ),
            Container(
              height: 140,
              width: largura,
              decoration: BoxDecoration(
                border: Border.all(color: Colors.black, width: 3),
                borderRadius: BorderRadius.circular(20),
                color: cor2,
              ),
              child: Icon(icone),
            ),
            Container(
              height: 140,
              width: largura,
              decoration: BoxDecoration(
                border: Border.all(color: Colors.black, width: 3),
                borderRadius: BorderRadius.circular(20),
                color: cor3,
              ),
            ),
          ],
        ),
      ),
    );
  }
}

Resultado:

Resultado

1 resposta
solução!

Olá Miguel! Tudo bem?

Você criou um aplicativo com um layout bem interessante, utilizando o widget Cardtest para criar cards com cores e ícones diferentes.

Parabéns pelo trabalho e pela dedicação em aprender mais sobre o Flutter. Com certeza, essa é uma ótima forma de praticar e aprimorar suas habilidades.

Um abraço e bons estudos.