Navigasi

Navigasi adalah interaksi yang memungkinkan pengguna melakukan navigasi di, ke dalam, dan ke luar dari berbagai bagian konten dalam aplikasi Anda.

Komponen Navigation Android Jetpack mencakup library Navigation, plugin Safe Args Gradle, dan alat untuk membantu Anda menerapkan navigasi aplikasi. Komponen Navigation menangani beragam kasus penggunaan navigasi, dari klik tombol yang sederhana hingga pola yang lebih kompleks, seperti panel aplikasi dan panel navigasi.

Konsep utama

Tabel berikut memberikan ringkasan tentang konsep utama dalam navigasi dan jenis utama yang Anda gunakan untuk menerapkannya.

Konsep

Tujuan

Jenis

Host

Elemen UI yang berisi tujuan navigasi saat ini. Artinya, saat pengguna menavigasi aplikasi, aplikasi pada dasarnya menukar tujuan masuk dan keluar dari host navigasi.

Grafik

Struktur data yang mendefinisikan semua tujuan navigasi dalam aplikasi dan cara tujuan tersebut terhubung.

NavGraph

Pengontrol

Koordinator pusat untuk mengelola navigasi antar-tujuan. Pengontrol memberikan metode untuk bernavigasi antar-tujuan, menangani deep link, mengelola data sebelumnya, dan banyak lagi.

NavController

Tujuan

Node dalam grafik navigasi. Saat pengguna membuka node ini, host akan menampilkan kontennya.

NavDestination

Biasanya dibuat saat membuat grafik navigasi.

Rute

Mengidentifikasi tujuan dan data apa pun yang diperlukan secara unik.

Anda dapat melakukan navigasi menggunakan rute. Rute akan mengarahkan Anda ke tujuan.

Jenis data serializable apa pun.

Manfaat dan fitur

Komponen Navigation memberikan sejumlah manfaat dan fitur lainnya, termasuk yang berikut:

  • Animasi dan transisi: Menyediakan resource standar untuk animasi dan transisi.
  • Deep linking: Menerapkan dan menangani deep link yang mengarahkan pengguna langsung ke tujuan.
  • Pola UI: Mendukung pola seperti panel navigasi dan navigasi bawah dengan tugas tambahan minimal.
  • Keamanan jenis: Mencakup dukungan untuk meneruskan data antar-tujuan dengan keamanan jenis.
  • Dukungan ViewModel: Memungkinkan pencakupan ViewModel ke grafik navigasi untuk membagikan data terkait UI antar-tujuan grafik.
  • Transaksi fragmen: Mendukung dan menangani transaksi fragmen sepenuhnya.
  • Kembali dan ke atas: Menangani tindakan kembali dan ke atas dengan benar secara default.

Opsi framework

Komponen Navigation mendukung dua framework utama untuk menerapkan grafik navigasi, bergantung pada arsitektur UI aplikasi Anda:

  • Compose: Jika aplikasi Anda dibuat sepenuhnya dengan Jetpack Compose, gunakan Navigation Compose. Tujuan dalam grafik Anda adalah composable.
  • Fragments: Jika aplikasi Anda menggunakan View atau campuran View dan Compose, gunakan komponen Navigation berbasis Fragment. Tujuan dalam grafik Anda adalah fragmen yang dapat menghosting View standar, konten Compose, atau kombinasi keduanya.

Untuk aplikasi yang bermigrasi dari View ke Compose, strategi yang direkomendasikan adalah terus menggunakan komponen Navigation berbasis Fragment saat mengonversi setiap layar ke Compose. Setelah semua fragmen diganti dengan composable, Anda dapat memigrasikan grafik navigasi ke Navigation Compose.

Menyiapkan lingkungan Anda

Untuk menyertakan dukungan navigasi dalam project Anda, tambahkan dependensi berikut ke file build.gradle aplikasi Anda:

Groovy

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.9.8"

  // 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"
}

Kotlin

plugins {
  // Kotlin serialization plugin for type safe routes and navigation arguments
  kotlin("plugin.serialization") version "2.0.21"
}

dependencies {
  val nav_version = "2.9.8"

  // 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")
}

Untuk informasi tentang menambahkan komponen arsitektur lainnya ke project Anda, lihat Menambahkan komponen ke project Anda.

Langkah berikutnya

Untuk dokumentasi dan referensi lain terkait dengan komponen Navigation, lihat referensi berikut ini.

Panduan mendetail

Untuk informasi selengkapnya tentang cara menerapkan host navigasi dan NavController, serta detail cara berinteraksi dengan Compose dan framework UI lainnya, lihat panduan berikut:

Codelab

Video

Contoh