[kotlin] Jetpack Compose에서 네비게이션 구성하기
Jetpack Compose는 안드로이드 앱의 UI를 작성하기 위한 현대적인 툴킷으로, 화면간의 네비게이션을 구성하는 것이 중요합니다. 이번 블로그 포스트에서는 Jetpack Compose에서 네비게이션을 구성하는 방법을 살펴보겠습니다.
Navigation Component 설정하기
Jetpack Compose에서 네비게이션을 구성하기 위해서는 navigation-compose 라이브러리를 사용해야 합니다.
implementation "androidx.navigation:navigation-compose:2.4.0-alpha02"
NavHost 설정하기
다음으로, NavHost를 설정해야 합니다. NavHost는 화면에서 다른 화면으로 이동할 때 필요한 뷰를 제공합니다.
val navController = rememberNavController()
NavHost(navController, startDestination = "main") {
composable("main") { MainScreen(navController) }
composable("detail") { DetailScreen(navController) }
}
화면 간 이동하기
화면 간 이동은 navController.navigate() 함수를 사용하여 처리할 수 있습니다.
Button(onClick = { navController.navigate("detail") }) {
Text("Go to Detail Screen")
}
뒤로 가기 처리하기
뒤로 가기 버튼을 눌렀을 때의 동작은 onBackDispatcher를 사용하여 처리할 수 있습니다.
val backDispatcher = LocalOnBackPressedDispatcherOwner.current.onBackPressedDispatcher
val onBackPressedCallback = remember {
object : OnBackPressedCallback(true) {
override fun handleOnBackPressed() {
if (navController.currentBackStackEntry?.destination?.route != "main") {
navController.popBackStack()
} else {
// Handle back press on the main screen
}
}
}
}
DisposableEffect(Unit) {
backDispatcher.addCallback(onBackPressedCallback)
onDispose {
onBackPressedCallback.remove()
}
}
Jetpack Compose에서 네비게이션을 구성하는 방법에 대해 간단히 살펴보았습니다. 다양한 네비게이션 기능을 추가하여 사용자가 앱을 편리하게 이용할 수 있도록 개발해 보세요.
참고: Jetpack Compose Navigation