Uma série de destinos pode ser agrupada em um gráfico aninhado dentro de um gráfico de navegação pai chamado de gráfico raiz. Os gráficos aninhados são úteis para organizar e reutilizar seções da IU do app, como um fluxo de login independente.
O gráfico aninhado encapsula os próprios destinos. Como em um gráfico raiz, um gráfico aninhado precisa ter um destino identificado como inicial. Os destinos fora do gráfico aninhado, por exemplo, aqueles no gráfico raiz, acessam o gráfico aninhado somente por meio do destino inicial.
A Figura 1 mostra um gráfico de navegação para um app simples de transferência de fundos. A partir do destino inicial à esquerda, o gráfico tem dois fluxos: um na parte superior para enviar dinheiro e outro na parte inferior para visualizar o saldo de uma conta.

Para agrupar destinos em um gráfico aninhado, faça o seguinte:
- No Navigation Editor, mantenha pressionada a tecla Shift e clique nos destinos que quer incluir no gráfico aninhado.
Clique com o botão direito do mouse para abrir o menu de contexto e selecione Move to Nested Graph > New Graph. Os destinos são colocados em um gráfico aninhado. A Figura 2 mostra um gráfico aninhado no Navigation Editor:
Figura 2. Gráfico aninhado no Graph Editor. Clique no gráfico aninhado. Os seguintes atributos aparecem no painel Attributes:
- Type contém o "Nested Graph".
- ID contém um ID atribuído pelo sistema ao gráfico aninhado. Esse ID é usado para fazer referência ao gráfico aninhado do seu código.
Clique duas vezes no gráfico aninhado para exibir os destinos.
Clique na guia Text para alternar para a visualização XML. Um gráfico de navegação aninhado foi adicionado ao gráfico. Este gráfico de navegação tem os próprios elementos
navigation
, com o ID e um atributostartDestination
que aponta para o primeiro destino no gráfico aninhado:<?xml version="1.0" encoding="utf-8"?> <navigation xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" xmlns:android="http://schemas.android.com/apk/res/android" app:startDestination="@id/mainFragment"> <fragment android:id="@+id/mainFragment" android:name="com.example.cashdog.cashdog.MainFragment" android:label="fragment_main" tools:layout="@layout/fragment_main" > <action android:id="@+id/action_mainFragment_to_sendMoneyGraph" app:destination="@id/sendMoneyGraph" /> <action android:id="@+id/action_mainFragment_to_viewBalanceFragment" app:destination="@id/viewBalanceFragment" /> </fragment> <fragment android:id="@+id/viewBalanceFragment" android:name="com.example.cashdog.cashdog.ViewBalanceFragment" android:label="fragment_view_balance" tools:layout="@layout/fragment_view_balance" /> <navigation android:id="@+id/sendMoneyGraph" app:startDestination="@id/chooseRecipient"> <fragment android:id="@+id/chooseRecipient" android:name="com.example.cashdog.cashdog.ChooseRecipient" android:label="fragment_choose_recipient" tools:layout="@layout/fragment_choose_recipient"> <action android:id="@+id/action_chooseRecipient_to_chooseAmountFragment" app:destination="@id/chooseAmountFragment" /> </fragment> <fragment android:id="@+id/chooseAmountFragment" android:name="com.example.cashdog.cashdog.ChooseAmountFragment" android:label="fragment_choose_amount" tools:layout="@layout/fragment_choose_amount" /> </navigation> </navigation>
No seu código, passe o ID do recurso da ação que conecta o gráfico raiz ao gráfico aninhado:
Kotlin
view.findNavController().navigate(R.id.action_mainFragment_to_sendMoneyGraph)
Java
Navigation.findNavController(view).navigate(R.id.action_mainFragment_to_sendMoneyGraph);
De volta à guia Design, você pode retornar ao gráfico raiz clicando em Root.
Referenciar outros gráficos de navegação com <include>
Em um gráfico de navegação, você pode referenciar outros gráficos usando include
.
Embora seja funcionalmente o mesmo que usar um gráfico aninhado, include
permite que você use gráficos de outros módulos do projeto ou de projetos de biblioteca, como mostrado no exemplo abaixo:
<!-- (root) nav_graph.xml --> <?xml version="1.0" encoding="utf-8"?> <navigation xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/nav_graph" app:startDestination="@id/fragment"> <include app:graph="@navigation/included_graph" /> <fragment android:id="@+id/fragment" android:name="com.example.myapplication.BlankFragment" android:label="Fragment in Root Graph" tools:layout="@layout/fragment_blank"> <action android:id="@+id/action_fragment_to_second_graph" app:destination="@id/second_graph" /> </fragment> ... </navigation>
<!-- included_graph.xml --> <?xml version="1.0" encoding="utf-8"?> <navigation xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/second_graph" app:startDestination="@id/includedStart"> <fragment android:id="@+id/includedStart" android:name="com.example.myapplication.IncludedStart" android:label="fragment_included_start" tools:layout="@layout/fragment_included_start" /> </navigation>
Outros recursos
Para saber mais sobre navegação, consulte os recursos adicionais a seguir.