Aplicação Flutter: Rotas de navegação

Nosso exemplo

A tela inicial do projeto criado nesse curso é mostrada na Figura 1.

Na Figura 2 temos uma demonstração de como é o fluxo da nossa aplicação.

Cada botão da aplicação nos levará a uma tela diferente.

O que vamos aprender?

No tópico anterior você praticou com Widgets, conhecendo um pouco mais sobre o que pode ser feito com eles. Neste curso avançaremos um pouco mais e veremos os seguintes conceitos:

• Rotas nomeadas;
• Métodos de navegação do Widget Navigator.

O que são rotas nomeadas?

Primeiro, vamos entender o conceito de rotas.

Rotas são caminhos/endereços para se acessar recursos. No exemplo desse curso, acessamos Widgets com elas.

Com as rotas, podemos navegar entre as telas de uma aplicação.

As rotas nomeadas acessam esses recursos por meio de nomes, que identificam qual rota queremos acessar. Veja na Figura 3 como isso funciona na aplicação.

O que é Widget Navigator?

O Widget Navigator é responsável por prover os recursos para a navegação da aplicação Flutter.

Os seus métodos são funcionalidades que nos permitem ir de uma tela a outra na aplicação.

Neste curso usaremos dois métodos desse Widget:

• Navigator.pushNamed: com esse método acessamos uma rota pelo seu nome. Com ele acessamos um Widget específico;
• Navigator.pop: com esse método retornamos a última tela acessada no histórico de navegação.

Por que esses conceitos são úteis?

Hoje em dia, grande parte das aplicações usam mais de uma tela. Raramente vemos aplicativos que tem todas as suas funcionalidades numa única tela.

Isso mostra a importância de se aprender a navegar entre telas dentro de uma aplicação. Fazer aplicações compostas por multitelas é um passo essencial para a programação mobile.