Navegación

La navegación se refiere a las interacciones que permiten a los usuarios navegar a través de las diferentes piezas de contenido de tu app, y dentro y fuera ellas.

El componente Navigation de Android Jetpack incluye la biblioteca de Navigation, el complemento Safe Args de Gradle y las herramientas para ayudarte a implementar la navegación en apps. El componente Navigation controla diversos casos de uso de navegación, desde clics simples en botones hasta patrones más complejos, como las barras de la aplicación y el panel lateral de navegación.

Conceptos clave

En la siguiente tabla, se proporciona una descripción general de los conceptos clave de la navegación y los tipos principales que usas para implementarlos.

Concepto

Propósito

Tipo

Host

Un elemento de la IU que contiene el destino de navegación actual. Es decir, cuando un usuario navega por una app, esta esencialmente intercambia destinos dentro y fuera del host de navegación.

Gráfico

Es una estructura de datos que define todos los destinos de navegación dentro de la app y cómo se conectan entre sí.

NavGraph

Controlador

Es el coordinador central para administrar la navegación entre destinos. El controlador ofrece métodos para navegar entre destinos, controlar vínculos directos, administrar la pila de actividades y mucho más.

NavController

Destino

Un nodo en el gráfico de navegación. Cuando el usuario navega a este nodo, el host muestra su contenido.

NavDestination

Por lo general, se crea cuando se construye el gráfico de navegación.

Ruta

Identifica de forma exclusiva un destino y los datos que este requiere.

Puedes navegar con rutas. Las rutas te llevan a los destinos.

Cualquier tipo de datos serializable

Beneficios y funciones

El componente Navigation ofrece algunos otros beneficios y funciones, entre los que se incluyen los siguientes:

  • Animaciones y transiciones: Proporciona recursos estandarizados para animaciones y transiciones
  • Vínculos directos: Implementa y controla vínculos directos que llevan al usuario directamente a un destino
  • Patrones de la IU: Admite patrones como los paneles laterales de navegación y la navegación inferior con un mínimo trabajo adicional
  • Seguridad de tipos: Incluye compatibilidad para pasar datos entre destinos con seguridad de tipos.
  • Compatibilidad con ViewModel: Permite definir el alcance de un elemento ViewModel en relación con un gráfico de navegación para compartir datos relacionados con la IU entre los destinos del gráfico
  • Transacciones de fragmentos: Admite y controla por completo transacciones de fragmentos
  • Acciones hacia atrás y arriba: Controla correctamente las acciones hacia atrás y arriba de forma predeterminada

Cómo configurar tu entorno

Para incluir compatibilidad con Navigation en tu proyecto, agrega las siguientes dependencias al archivo build.gradle de tu app:

GroovyKotlin
plugins {
  // Kotlin serialization plugin for type safe routes and navigation arguments
  id 'org.jetbrains.kotlin.plugin.serialization' version '2.0.21'
}
  
dependencies {
  def nav_version = "2.8.9"

  // Jetpack Compose Integration
  implementation "androidx.navigation:navigation-compose:$nav_version"

  // Views/Fragments Integration
  implementation "androidx.navigation:navigation-fragment:$nav_version"
  implementation "androidx.navigation:navigation-ui:$nav_version"

  // Feature module support for Fragments
  implementation "androidx.navigation:navigation-dynamic-features-fragment:$nav_version"

  // Testing Navigation
  androidTestImplementation "androidx.navigation:navigation-testing:$nav_version"

  // JSON serialization library, works with the Kotlin serialization plugin.
  implementation "org.jetbrains.kotlinx:kotlinx-serialization-json:1.7.3"
}
 
plugins {
  // Kotlin serialization plugin for type safe routes and navigation arguments
  kotlin("plugin.serialization") version "2.0.21"
}

dependencies {
  val nav_version = "2.8.9"

  // Jetpack Compose integration
  implementation("androidx.navigation:navigation-compose:$nav_version")

  // Views/Fragments integration
  implementation("androidx.navigation:navigation-fragment:$nav_version")
  implementation("androidx.navigation:navigation-ui:$nav_version")

  // Feature module support for Fragments
  implementation("androidx.navigation:navigation-dynamic-features-fragment:$nav_version")

  // Testing Navigation
  androidTestImplementation("androidx.navigation:navigation-testing:$nav_version")

  // JSON serialization library, works with the Kotlin serialization plugin
  implementation("org.jetbrains.kotlinx:kotlinx-serialization-json:1.7.3")
}

Si quieres obtener información sobre cómo agregar otros componentes de la arquitectura a tu proyecto, consulta Cómo agregar componentes a tu proyecto.

Próximos pasos

Para consultar más documentación y recursos relacionados con el componente Navigation, accede a los siguientes recursos.

Guías detalladas

Para obtener más información sobre cómo implementar un host de navegación y NavController, además de detalles sobre cómo interactúan con Compose y otros frameworks de IU, consulta las siguientes guías:

Codelabs

Videos

Ejemplos

Jetsnack sample

Jetsnack is a sample snack ordering app built with Jetpack Compose. To try out this sample app, use the latest stable version of Android Studio. You can clone this repository or import the project from Android Studio following the steps here. This

Jetcaster sample 🎙️

Jetcaster is a sample podcast app, built with Jetpack Compose. The goal of the sample is to showcase building with Compose across multiple form factors (mobile, TV, and Wear) and full featured architecture. To try out this sample app, use the latest

Jetchat sample

Jetchat is a sample chat app built with Jetpack Compose. To try out this sample app, use the latest stable version of Android Studio. You can clone this repository or import the project from Android Studio following the steps here. This sample