Android Academy · Aula

Componente de navegação

Gerencie a navegação entre várias telas com um NavGraph visual, Safe Args para argumentos com segurança de tipos, NavController e suporte a links profundos.

Aula 5 de 613 etapas

Componente de navegação é uma aula grátis de Android Academy no CoddyKit. Esta é a aula 5 de 6. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de Android Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de Android Academy inclui 6 aulas no total.

O que é o Navigation Component?

O Navigation Component é uma biblioteca do Android Jetpack que gerencia a navegação entre fragments, a pilha de retorno, deep links e animações de transição em um único grafo visual.

Principais benefícios:

  • Grafo visual de navegação no Android Studio
  • Passagem de argumentos com segurança de tipos (Safe Args)
  • Gerenciamento automático da pilha de retorno
  • Suporte integrado a deep links

Configuração: dependências

Adicione ao app/build.gradle:

// app/build.gradle
dependencies {
    implementation 'androidx.navigation:navigation-fragment-ktx:2.7.7'
    implementation 'androidx.navigation:navigation-ui-ktx:2.7.7'
}

// project/build.gradle (for Safe Args):
buildscript {
    dependencies {
        classpath 'androidx.navigation:navigation-safe-args-gradle-plugin:2.7.7'
    }
}

// app/build.gradle — apply the plugin:
plugins {
    id 'androidx.navigation.safeargs.kotlin'
}

Grafo de navegação (nav_graph.xml)

Crie res/navigation/nav_graph.xml. Ele define os destinos (fragments) e as ações (caminhos de navegação):

<!-- res/navigation/nav_graph.xml -->
<navigation
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/nav_graph"
    app:startDestination="@id/homeFragment">

    <fragment
        android:id="@+id/homeFragment"
        android:name="com.example.HomeFragment">
        <action
            android:id="@+id/action_home_to_detail"
            app:destination="@id/detailFragment" />
    </fragment>

    <fragment
        android:id="@+id/detailFragment"
        android:name="com.example.DetailFragment">
        <argument
            android:name="itemId"
            app:argType="integer" />
    </fragment>
</navigation>

NavHostFragment no layout da Activity

Substitua o contêiner FrameLayout por NavHostFragment. Ele funciona como host de todos os destinos de navegação:

<!-- activity_main.xml -->
<androidx.fragment.app.FragmentContainerView
    android:id="@+id/navHostFragment"
    android:name="androidx.navigation.fragment.NavHostFragment"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:navGraph="@navigation/nav_graph"
    app:defaultNavHost="true" />

NavController — navegando entre fragments

Obtenha um NavController e chame navigate() com um ID de ação:

class HomeFragment : Fragment() {

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        binding.btnOpenDetail.setOnClickListener {
            // Navigate using action ID from nav_graph
            findNavController().navigate(R.id.action_home_to_detail)
        }
    }
}

Safe Args — argumentos com segurança de tipos

O Safe Args gera classes para passar argumentos entre fragments sem conversões de tipo nem erros de digitação nas chaves:

// In HomeFragment — pass itemId:
binding.btnOpenDetail.setOnClickListener {
    val action = HomeFragmentDirections.actionHomeToDetail(itemId = 42)
    findNavController().navigate(action)
}

// In DetailFragment — receive itemId:
class DetailFragment : Fragment() {
    private val args: DetailFragmentArgs by navArgs()

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
        val id = args.itemId   // Int, type-safe
        viewModel.loadItem(id)
    }
}

Navegação para cima

Conecte o botão de navegação para cima da Toolbar ao NavController para ativar a navegação automática de retorno:

class MainActivity : AppCompatActivity() {

    private lateinit var navController: NavController

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val navHostFragment = supportFragmentManager
            .findFragmentById(R.id.navHostFragment) as NavHostFragment
        navController = navHostFragment.navController

        // Wire toolbar Up button
        setupActionBarWithNavController(navController)
    }

    override fun onSupportNavigateUp(): Boolean {
        return navController.navigateUp() || super.onSupportNavigateUp()
    }
}

Navegação inferior com NavController

Conecte um BottomNavigationView ao NavController — ele gerencia automaticamente a seleção de abas e a pilha de retorno:

// In Activity.onCreate():
val navHostFragment = supportFragmentManager
    .findFragmentById(R.id.navHostFragment) as NavHostFragment
val navController = navHostFragment.navController

// Wire BottomNavigationView
binding.bottomNav.setupWithNavController(navController)

// Each menu item ID must match a fragment destination ID in nav_graph.xml

Remover itens da pilha de retorno

Volte programaticamente ou navegue até um destino específico:

// Go back one step
findNavController().popBackStack()

// Navigate back to a specific destination (popping everything on top)
findNavController().popBackStack(R.id.homeFragment, inclusive = false)

// Navigate and clear back stack (e.g., after login)
findNavController().navigate(
    R.id.action_login_to_home,
    null,
    NavOptions.Builder()
        .setPopUpTo(R.id.loginFragment, inclusive = true)
        .build()
)

Deep links

Adicione um deep link a um destino para que seu aplicativo possa ser aberto a partir de uma URL:

<!-- In nav_graph.xml, inside the destination fragment: -->
<deepLink
    android:id="@+id/deepLinkDetail"
    app:uri="https://example.com/items/{itemId}" />

<!-- Also add intent-filter in AndroidManifest.xml for the Activity: -->
<intent-filter>
    <action android:name="android.intent.action.VIEW" />
    <category android:name="android.intent.category.DEFAULT" />
    <category android:name="android.intent.category.BROWSABLE" />
    <data android:scheme="https" android:host="example.com" />
</intent-filter>

Transições entre fragments

Adicione animações personalizadas às ações de navegação no grafo de navegação:

<action
    android:id="@+id/action_home_to_detail"
    app:destination="@id/detailFragment"
    app:enterAnim="@anim/slide_in_right"
    app:exitAnim="@anim/slide_out_left"
    app:popEnterAnim="@anim/slide_in_left"
    app:popExitAnim="@anim/slide_out_right" />

Verificação rápida

O que deve corresponder entre o ID do item de menu do BottomNavigationView e o grafo de navegação para que as abas sejam gerenciadas automaticamente?

Recapitulação: Navigation Component

O Navigation Component simplifica aplicativos com várias telas:

  • nav_graph.xml visual — destinos + ações
  • NavHostFragment no layout da Activity
  • findNavController().navigate(actionId) para navegar entre telas
  • Safe Args — passagem de argumentos com segurança de tipos (sem conversões de tipo nem erros de digitação)
  • setupActionBarWithNavController() — botão para cima automático
  • setupWithNavController() — BottomNavigationView automático

A seguir: adicione injeção de dependências com Hilt para obter uma arquitetura limpa.

Grátis para começar

Aprenda Kotlin com um tutor de IA — grátis

Escreva e execute código real no seu navegador, obtenha ajuda instantânea de um tutor de IA 24/7 e continue de onde parou na web ou no app.

Cursos
36
Aulas
152

Perguntas Frequentes

A aula “Componente de navegação” é grátis?

Sim — o texto completo de “Componente de navegação” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de Android Academy, atualize para CoddyKit PRO. O curso de Android Academy inclui 6 aulas no total.

O que vou aprender em “Componente de navegação”?

Gerencie a navegação entre várias telas com um NavGraph visual, Safe Args para argumentos com segurança de tipos, NavController e suporte a links profundos. Você pratica Android Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.

Preciso ter experiência prévia para começar Android Academy?

Nenhuma experiência prévia é necessária. Android Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 5 de 6.

Quanto tempo leva a aula “Componente de navegação”?

A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.

Posso escrever e executar código nesta aula de Android Academy?

Sim. Cada aula de Android Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.

Todas as aulas deste curso

  1. ViewModel e LiveData
  2. Banco de dados Room
  3. Corrotinas e funções suspend
  4. Padrão Repository
  5. Componente de navegação
  6. Injeção de dependências com Hilt
← Voltar para Android Academy