1
resposta

[Projeto] Como eu fiz: o Widget contra ataca

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text('Tarefas'),
          foregroundColor: Colors.white,
          backgroundColor: Colors.blue,
        ),
        body: Stack(
          children: [
            Container(color: Color.fromARGB(255, 208, 221, 237),),
            ListView(
              children: [
                Paleta(Colors.white, Color.fromARGB(255, 255, 64, 129), Color.fromARGB(255, 64, 196, 255)),
                Paleta(Color.fromARGB(255, 233, 30, 99), Color.fromARGB(255, 156, 39, 176), Color.fromARGB(255, 68, 138, 255)),
                Paleta(Color.fromARGB(255, 255, 64, 129), Color.fromARGB(255, 255, 193, 7), Color.fromARGB(255, 3, 169, 244)),
                Paleta(Color.fromARGB(255, 224, 64, 251), Colors.white, Color.fromARGB(255, 76, 175, 80)),
              ],),
          ],
        ),
      ),
    );
  }
}


class Paleta extends StatelessWidget {
  final Color cor1;
  final Color cor2;
  final Color cor3;
  const Paleta(this.cor1, this.cor2, this.cor3,{super.key});

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: Container(
        child: Row(
          children: [
          Container(color: cor1, width: 100, height: 150,),
          Container(color: cor2, width: 100, height: 150,),
          Container(color: cor3, width: 100, height: 150,),
        ],),
      ),
    );
  }
}
1 resposta

Oi Cláudio, tudo bem?

Excelente trabalho ao compartilhar esse código em Flutter! É notável que você tem conhecimento sobre a criação de widgets e como estruturar uma interface em Flutter.

Vamos analisar algumas das principais observações sobre o código:

  1. Boa estrutura de classes: A organização das classes está adequada. Você definiu duas classes, MyApp e Paleta, e cada uma delas tem suas responsabilidades bem definidas, o que é uma prática importante para manter o código modular e de fácil manutenção.

  2. Utilização de StatelessWidget: A classe MyApp é uma StatelessWidget, o que é apropriado, pois a interface não precisa rastrear ou atualizar estados internos.

  3. Definição do tema: É positivo ver que você definiu um tema para o aplicativo por meio do themeData do MaterialApp. Você também utilizou colorScheme para definir uma paleta de cores para o aplicativo.

  4. Uso de Stack e ListView: A utilização de um Stack para colocar a lista de paletas em cima de um fundo é uma abordagem adequada. Da mesma forma, o uso de um ListView para exibir várias paletas de cores de forma vertical é uma escolha apropriada para esse layout.

  5. Widget Reutilizável Paleta: A criação do widget reutilizável Paleta é uma excelente prática. Isso permite que você reutilize esse widget em diferentes partes do aplicativo, tornando o código mais limpo e fácil de manter.

  6. Utilização de Padding: O uso do widget Padding para adicionar espaçamento entre as paletas de cores é uma boa escolha para garantir que o layout fique mais organizado e agradável.

  7. Construção da interface: A construção da interface dentro do MyApp está clara e bem definida, com uso adequado de widgets como Container, Row e Column para criar a disposição visual.

No geral, o seu código é bem escrito e demonstra um bom domínio dos conceitos do Flutter. Continue praticando e explorando mais widgets e recursos do Flutter para aprimorar suas habilidades.

Um abraço e bons estudos.