Fluxo de navegação
Por que importa
O fluxo de navegação determina como as pessoas avançam entre telas, drawers e modais. Uma estrutura bem definida evita becos sem saída, garante retomada rápida de contexto e mantém o produto coerente em diferentes dispositivos.
Forma canônica (sintaxe mínima)
Fluxo básico entre duas telas
Por quê: exibe rotas bidirecionais simples usando botões que referenciam slugs válidos.
Padrões de uso
Usar navigator para seções irmãs
Quando usar: oferecer menus persistentes em telas com status equivalente. Por quê: o navigator mantém destinos sempre acessíveis e reduz dependência de botões dispersos.
Abrir drawer para contexto complementar
Quando usar: exibir detalhes sem abandonar a tela principal. Por quê: drawers expandem o fluxo lateralmente, mantendo origem e destino visíveis.
Encadear modal de confirmação
Quando usar: exigir confirmação explícita antes de executar ações críticas. Por quê: modais bloqueiam a navegação atual até que a pessoa tome uma decisão.
Erros comuns (Do/Don’t)
❌ Errado — Destino inválido
✅ Correto — Destino registrado
Por quê: nomes incorretos geram falhas de navegação e experiências quebradas.
❌ Errado — Fechamento inconsistente
✅ Correto — Consistência de fechamento
Por quê: previsibilidade reduz erros e reforça comportamento mental das pessoas usuárias.
❌ Errado — Drawer sem fechar
✅ Correto — Drawer com botões de saída
Por quê: overlays precisam de caminhos claros para voltar ao estado anterior.
Referências cruzadas
Relacionados
Screen: unidade principal onde o fluxo acontece.Navigator: menus persistentes entre telas irmãs.Modal: confirmações críticas no fluxo.Drawer: detalhes laterais sem perder o contexto.
Composições recomendadas
- Fluxo de navegação + Navigator → estrutura páginas de mesmo nível.
- Fluxo de navegação + Modal Flow → garante tratamento completo de confirmações.
- Fluxo de navegação + Drawer Detail → combina lista principal com detalhes paralelos.
Fluxo com navigator e modal
Por quê: integra navegação persistente com confirmação modal antes de redirecionar.