Navigation Compose: bu nima, arxitekturasi va ishlab chiqishda qo'llanilishi

Navigation Compose nima?

Navigation Compose — Compose ilovalari uchun navigatsiya freymvorkini ta'minlovchi Jetpack kutubxonasidir. Kutubxona View tizimi uchun Navigation Component bilan bir xil prinsiplarga asoslanadi, lekin Compose-ning deklarativ tabiatiga moslashtirilgan: FragmentTransaction o'rniga composable funksiyalari, navigatsiya grafigi esa Kotlin DSL orqali quriladi.

Navigation Compose-ni klassik navigatsiyadan asosiy farqi — FragmentManager yo'qligi. Har bir ekran marshrut mos kelganda NavHost-da render qilinadigan composable funksiyasidir. Back stack Fragment emas, balki route, argumentlar va holat bilan yozuvni saqlaydi. Bu arxitekturani soddalashtiradi va Fragment navigatsiyasiga xos bo'lgan lifecycle konfliktlarini bartaraf qiladi.

Google (2025) ma'lumotlariga ko'ra, Navigation Compose experimental-dan stable-gacha yo'lni bosib o'tgan va 2.8.0 versiyasidan boshlab Jetpack tarkibiga kiradi. Kutubxona Material3, Type-Safe Navigation (Kotlin Serialization orqali), ichma-ich grafiklar va modulyarizatsiyani qo'llab-quvvatlaydi. Yagona cheklov — qo'lda sozlashsiz BottomNavigation uchun multi-back stack qo'llab-quvvatlanmasligi, ammo Google buning ustida ishlamoqda.

Navigation Compose arxitekturasi uchta mavjudot atrofida quriladi: NavController (stekni boshqarish), NavHost (grafik konteyneri) va NavDestination (composable bilan alohida marshrut). Ular o'rtasidagi o'zaro ta'sir deklarativdir: dasturchi marshrutlar va argumentlarni tavsiflaydi, kutubxona esa yuklash, saqlash va tiklash holatlarini boshqaradi.

NavController: yaratish va navigatsiya metodlari

NavController — Navigation Compose-ning navigatsiya stekini boshqaruvchi markaziy elementi. rememberNavController() orqali yaratiladi va NavHost-ga uzatiladi. NavController back stack-ni, joriy kirish nuqtasini saqlaydi va kechiktirilgan harakatlarni (grafik ishga tushirilgandan keyin deeplink) qo'llab-quvvatlaydi.

@Composable
fun AppNavigation() {
    val navController = rememberNavController()
    NavHost(navController = navController, startDestination = "home") {
        composable("home") { HomeScreen(navController) }
        composable("profile/{userId}") { backStackEntry ->
            ProfileScreen(
                userId = backStackEntry.arguments?.getString("userId") ?: ""
            )
        }
    }
}

NavController-ning asosiy metodlari: navigate(route) — marshrutga o'tish, popBackStack() — oldingi ekranga qaytish, navigateAndClear(route) — stekni tozalash bilan o'tish. NavOptions xatti-harakatni belgilaydi: launchSingleTop takrorlanishni oldini oladi, popUpTo stekni ko'rsatilgan marshrutgacha tozalaydi, restoreState oldingi holatni tiklaydi.

Chuqur ichma-ich composable funksiyalaridan NavController-ga kirish uchun CompositionLocal orqali NavHostController dan foydalaning. LocalNavController NavHost ichidagi ScopedNavController da taqdim etiladi. NavHost tashqarisida (masalan, BottomNavigation da) kontroller parametrlar yoki ViewModel orqali uzatiladi.

NavHost: marshrut grafigini qurish

NavHost — NavController-ni marshrut grafigi bilan bog'lovchi composable konteyner. Har bir marshrut composable(route, arguments, deepLinks) orqali e'lon qilinadi, bu yerda route — {param} bilan ixtiyoriy to'ldiruvchilarga ega marshrut qatori. Joriy marshrut route bilan mos kelganda, NavHost tegishli composable blokini render qiladi.

Marshrut grafigi ierarxik tarzda quriladi: modul ichidagi marshrutlarni guruhlash uchun navigation() orqali grafiklarni ichma-ich joylashtirish mumkin. Ichma-ich grafiklarning o'z startDestination-i bor va umumiy route-prefiksi ostida birlashtiriladi. Bu har bir feature-modul o'z pastki grafigini ro'yxatdan o'tkazadigan modulli arxitekturani tashkil qilish imkonini beradi.

NavHost(
    navController = navController,
    startDestination = "main"
) {
    composable("main") { MainScreen(navController) }
    navigation(
        route = "auth",
        startDestination = "auth/login"
    ) {
        composable("auth/login") { LoginScreen(navController) }
        composable("auth/register") { RegisterScreen(navController) }
    }
}

NavHost LocalBackDispatcher orqali tizimning Orqaga tugmasini (back press) avtomatik boshqaradi. Material3 Scaffold-da BottomNavigation to'g'ri ishlashi uchun NavController sukut bo'yicha qabul qilinadi. NavHost marshrut o'zgarishida composable-ni qayta yaratadi, lekin kiritish maydonlari va scroll uchun rememberSaveable orqali holatni saqlaydi.

Argumentlarni ekranlar o'rtasida uzatish

Navigation Compose marshrut parametrlari va NavType orqali ekranlar o'rtasida tiplangan argumentlarni uzatishni qo'llab-quvvatlaydi. Parametrlar route-da {paramName} sifatida composable()-da arguments orqali turni ko'rsatish bilan belgilanadi. NavType String, Int, Long, Float, Boolean, Parcelable va Serializable ni qo'llab-quvvatlaydi.

Argumentlar NavBackStackEntry dan arguments?.getType(key) orqali olinadi. Majburiy parametrlar uchun defaultValue, ixtiyoriylar uchun nullable dan foydalaning. Parcelable qo'llab-quvvatlashi faqat Kotlin Parcelize yoki kotlinx.parcelize kutubxonasi bilan ishlaydi. Murakkab ob'ektlar uchun ID uzatish va ma'lumotlarni ViewModel orqali yuklash tavsiya etiladi, butun ob'ektni seriyalashtirish o'rniga.

Navigation 2.8.0 versiyasidan boshlab Type-Safe Navigation Kotlin Serialization bilan mavjud: marshrutlar data-sinflar, argumentlar esa maydonlar sifatida belgilanadi. Bu qator route-larni tiplangan ob'ektlar bilan almashtiradi va marshrut nomlaridagi xatolarni bartaraf qiladi. Migratsiya uchun Kotlin Serialization plagini va navigation-compose-typesafe bog'liqligi talab qilinadi.

@Serializable
/* sealed class Route */
sealed class ProfileRoute(val route: String) {
    data object Home : ProfileRoute("home")
    data class Profile(val userId: String) : ProfileRoute("profile/{userId}")
}

Navigation Compose-da chuqur havolalar (Deep Links)

Deep Links — URL yoki intent-filter orqali ilovaning ma'lum ekranini ochish imkonini beruvchi navigatsiya mexanizmi. Navigation Compose-da chuqur havolalar composable()-dagi deepLinks parametri orqali sozlanadi va URI naqshga mos kelganda avtomatik qayta ishlanadi.

Deep Link UriPattern ro'yxati sifatida belgilanadi: "https://example.com/profile/{userId}". URI dan parametrlar avtomatik ravishda marshrut argumentlariga moslashtiriladi. NavController chuqur havolani ilova ishga tushirilganda (intent orqali) va ish jarayonida (implicit deep links orqali) qayta ishlaydi. Kutayotgan chuqur havolalarni qayta ishlash uchun grafik ishga tushirilgandan keyin NavController da handleDeepLink() dan foydalaniladi.

Google ga ko'ra, chuqur havolalarni sozlash tavsiya etiladi: push bildirishnomalari (Firebase Dynamic Links), elektron pochta tasdiqlash, kontent ulashish va veb havolalardan navigatsiya uchun. Android 12+ uchun chuqur havolaning ishonchliligini tekshirish uchun Digital Asset Links ishlatiladi. AndroidManifest.xml havolalarni dialogsiz ochish uchun autoVerify="true" bilan intent-filter ni o'z ichiga olishi kerak.

composable(
    route = "profile/{userId}",
    arguments = listOf(navArgument("userId") { type = NavType.StringType }),
    deepLinks = listOf(
        navDeepLink { uriPattern = "https://example.com/profile/{userId}" }
    )
) { backStackEntry ->
    ProfileScreen(userId = backStackEntry.arguments?.getString("userId") ?: "")
}

Navigation Compose-da chuqur havola cheklovlari: kutubxona kechiktirilgan chuqur havolalarni qo'llab-quvvatlamaydi — chuqur havola faqat NavHost grafikni to'liq qurgandan keyin qayta ishlanadi. Agar chuqur havola grafik ishga tushirilishidan oldin kelsa, uni intent?.data orqali kechiktirish va LaunchedEffect da qayta ishlash kerak. Firebase Dynamic Links uchun Navigation Compose bilan birgalikda Firebase Dynamic Links SDK dan foydalaning.

Ekranlar o'rtasida o'tish animatsiyasi

Navigation Compose composable()-dagi enterTransition, exitTransition, popEnterTransition va popExitTransition parametrlari orqali o'tish animatsiyasini qo'llab-quvvatlaydi. Animatsiyalar Compose Animation API orqali amalga oshiriladi: fadeIn, slideInHorizontally, expandIn va boshqalar. Sukut bo'yicha animatsiya o'chirilgan — ekranlar bir zumda almashtiriladi.

Odatiy animatsiya stsenariylari: oldinga navigatsiya uchun slideInHorizontally (ekran o'ng tomondan kiradi), qaytish uchun slideOutHorizontally (ekran o'ng tomonga chiqadi). BottomNavigation uchun ko'pincha siljishsiz fade animatsiyasi ishlatiladi. Animatsiyalar NavHost orqali o'rnatiladi va agar individual ko'rsatilmagan bo'lsa, barcha composable-larga qo'llaniladi.

NavHost(
    navController = navController,
    startDestination = "home",
    enterTransition = { slideInHorizontally() + fadeIn() },
    exitTransition = { slideOutHorizontally() + fadeOut() },
    popEnterTransition = { fadeIn() },
    popExitTransition = { slideOutHorizontally() + fadeOut() }
) { /* composable */ }

Animatsiyalarni har bir composable uchun alohida, animatsiya parametrlarini to'g'ridan-to'g'ri composable()-da uzatish orqali bekor qilish mumkin. Muhim: animatsiyalar tizimning orqaga tugmasi animatsiyasi bilan ziddiyatga kelmasligi kerak. Shared element transition uchun accompanist-navigation-animation kutubxonasi yoki Modifier.graphicsLayer orqali maxsus amalga oshirish talab qilinadi. Android Developers (2025) ma'lumotlariga ko'ra, ishlab chiqarish ilovalarining 80% standart navigatsiya uchun gorizontal slide animatsiyasidan foydalanadi.