Navegação e rotas

Um aplicativo com uma única tela não existe. Assim que há uma lista, há um detalhe; assim que há um detalhe, há um botão de voltar, um gesto de deslizar no iOS, uma tecla física no Android, e a questão de saber o que fica na memória enquanto isso.

O Flutter modela isso como uma pilha. A tela visível é a do topo; empilhar adiciona uma por cima, desempilhar a remove e revela a anterior. O Navigator, fornecido de graça pelo MaterialApp, mantém essa pilha, anima as transições conforme as convenções da plataforma e conecta o botão de voltar físico. O modelo é simples, e é justamente por isso que é preciso entender seus limites antes de escolher uma ferramenta mais elaborada.

O assunto também é aquele em que se adquirem os hábitos ruins mais custosos: rotas nomeadas com argumentos sem tipo que o compilador não verifica, uma pilha que cresce indefinidamente porque se empilha uma tela de login em vez de substituí-la, um context usado após um await quando a tela já desapareceu. Trataremos os três.

Empilhar e desempilhar

A forma mais direta constrói a tela de destino no próprio local: