5
respostas

Lista de Tasks não atualiza ao apertar o botão "Adicionar"

Ao preencher os campos da FormScreen e apertar o botão "Adicionar", o aplicatio volta para a tela inicial, porém a lista não atualiza logo de cara, é necessário entrar e sair da tela uma segunda vez para que a tarefa nova seja carregada.

Seguem as linhas com os contexts:

home: TaskInherited(child: const InitialScreen()),
floatingActionButton: FloatingActionButton(
        onPressed: () {
          Navigator.push(
            context,
            MaterialPageRoute(
              builder: (contextNew) => FormScreen(taskContext: context),
            ),
          );
        },
        child: const Icon(Icons.add),
      ),
ElevatedButton(
                    onPressed: () {
                      if (_formKey.currentState!.validate()) {
                        // print(nameController.text);
                        // print(int.parse(dificultyController.text));
                        // print(imageController.text);
                        TaskInherited.of(widget.taskContext).newTask(
                            nameController.text,
                            imageController.text,
                            int.parse(dificultyController.text));
                        ScaffoldMessenger.of(context).showSnackBar(
                          const SnackBar(
                            content: Text('Criando nova tarefa'),
                          ),
                        );

                        Navigator.pop(context);
                      }
                    },
                    child: Text('Adicionar'),
                  )

Aqui está o github do projeto até então: https://github.com/cmsulzbeck/primeiro_app_flutter

5 respostas

Voce já colocou sua Task como StatefulWidget?

Outro fator importante é que a página inicial só atualiza se uma outra tarefa for adicionada, quando eu clico no botão "Adicionar", somente a anterior aparece.

Olá Fernando! Sim a Task é um StatefulWidget no meu código:

import 'package:flutter/material.dart';
import 'package:nosso_primeiro_projeto/components/dificuldade.dart';

class Task extends StatefulWidget {
  final String nome;
  final String foto;
  final int dificuldade;

  const Task(
      {Key? key,
        required this.nome,
        required this.foto,
        required this.dificuldade})
      : super(key: key);

  @override
  State<Task> createState() => _TaskState();
}

class _TaskState extends State<Task> {
  int nivel = 0;

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: Stack(
        children: [
          Container(
            height: 140,
            decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(4),
              color: Colors.blue,
            ),
          ),
          Column(
            children: [
              Container(
                height: 100,
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(4),
                  color: Colors.white,
                ),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Container(
                      width: 72,
                      height: 100,
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(4),
                        color: Colors.black26,
                      ),
                      child: ClipRRect(
                        borderRadius: BorderRadius.circular(4),
                        child: Image.asset(
                          widget.foto,
                          fit: BoxFit.cover,
                        ),
                      ),
                    ),
                    Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        SizedBox(
                          width: 200,
                          child: Text(
                            widget.nome,
                            style: const TextStyle(fontSize: 24),
                            overflow: TextOverflow.ellipsis,
                          ),
                        ),
                        Dificuldade(nivelDificuldade: widget.dificuldade,)
                      ],
                    ),
                    SizedBox(
                      height: 52,
                      width: 52,
                      child: ElevatedButton(
                          onPressed: () {
                            setState(() {
                              nivel++;
                            });
                          },
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                            crossAxisAlignment: CrossAxisAlignment.end,
                            children: const [
                              Icon(Icons.arrow_drop_up),
                              Text(
                                'UP',
                                style: TextStyle(fontSize: 12),
                              )
                            ],
                          )),
                    )
                  ],
                ),
              ),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Padding(
                    padding: const EdgeInsets.all(8),
                    child: SizedBox(
                      width: 200,
                      child: LinearProgressIndicator(
                        color: Colors.white,
                        value: widget.dificuldade > 0
                            ? (nivel / widget.dificuldade) / 10
                            : 1,
                      ),
                    ),
                  ),
                  Padding(
                    padding: const EdgeInsets.all(12),
                    child: Text(
                      'Nível: $nivel',
                      style: const TextStyle(color: Colors.white, fontSize: 16),
                    ),
                  ),
                ],
              ),
            ],
          ),
        ],
      ),
    );
  }
}

Você pode usar OnChanged para verificar se houve uma mudança, e usar o setState para informar para o stateful que ouve a mudança

Olá, Estou exatamente com o mesmo problema que enviei há algumas horas atrás. A lista de tarefas só se atualiza quando se adiciona a segunda tarefa.

https://cursos.alura.com.br/forum/topico-falha-ao-renderizar-tarefa-pela-primeira-vez-273222

Olha... acho que descobri aqui. Eu peguei o projeto final deste curso e executei, e realmente funciona, porém descobri um bug, que é exatamente o cerne dos problemas. Ao apagar a última tarefa da lista, ou seja, se a lista ficar com 4 tarefas default, ocorre o mesmo problema que o nosso. Ou seja, o Bug ocorre quando a lista de tarefas default é inicializada com 4 elementos ao invés de 5. Portanto, deve ser algum BUG de caráter visual, e não sobre o estado do widget.

No meu caso, a lista não atualizava os valores na primeira tentativa também porque eu inicializava a lista de tarefas default com 4 elementos ao invés de 5.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software