이 페이지는 Cloud Translation API를 통해 번역되었습니다.

대상으로 이동

탐색 구성요소는 대상으로 이동하는 간단하고 일반적인 방법을 제공합니다. 이 인터페이스는 다양한 컨텍스트와 UI 프레임워크를 지원합니다. 예를 들어 탐색 구성요소를 Compose, 뷰, 프래그먼트, 활동, 맞춤 UI 프레임워크와 함께 사용할 수 있습니다.

이 가이드에서는 탐색 구성요소를 사용하여 다양한 컨텍스트에서 대상으로 이동하는 방법을 설명합니다.

NavController 사용

대상 간에 이동하는 데 사용하는 키 유형은 NavController입니다. 클래스 자체와 그 인스턴스를 만드는 방법에 관한 자세한 내용은 탐색 컨트롤러 만들기를 참고하세요. 이 가이드에서는 사용 방법을 자세히 설명합니다.

탐색

사용하는 UI 프레임워크에 관계없이, 대상으로 이동하는 데 사용할 수 있는 단일 함수(NavController.navigate())가 있습니다.

navigate()에 사용할 수 있는 오버로드는 많습니다. 선택해야 하는 오버로드는 정확한 컨텍스트에 해당합니다. 예를 들어 컴포저블로 이동할 때 한 오버로드를 사용하고 뷰로 이동할 때 다른 오버로드를 사용해야 합니다.

다음 섹션에서는 개발자가 할 수 있는 몇 가지 주요 navigate() 오버로드를 간략히 설명합니다. 사용합니다

컴포저블로 이동

컴포저블로 이동하려면 NavController.navigate<T>를 사용해야 합니다. 이 오버로드를 통해 navigate()는 단일 route 인수를 사용하며, 유형을 전달합니다. 대상의 키 역할을 합니다.

@Serializable
object FriendsList

navController.navigate(route = FriendsList)

탐색 그래프에서 컴포저블로 이동하려면 먼저 NavGraph: 각 대상은 유형에 상응합니다. 대상 composable() 함수를 사용하면 됩니다.

컴포저블의 이벤트 노출

구성 가능한 함수가 새 화면으로 이동해야 하는 경우 navigate()를 직접 호출할 수 있도록 NavController 참조를 전달하면 안 됩니다. 단방향 데이터 흐름(UDF) 원칙에 따라 컴포저블은 대신 NavController가 처리하는 이벤트를 노출해야 합니다.

좀 더 쉽게 말하면 컴포저블에는 () -> Unit 유형의 매개변수가 있어야 합니다. composable() 함수를 사용하여 NavHost에 대상을 추가할 때 컴포저블에 NavController.navigate() 호출을 전달합니다.

이에 관한 예는 다음 하위 섹션을 참고하세요.

예

이전 섹션의 설명으로, 다음 스니펫입니다.

그래프의 각 대상은 직렬화에 필요한 데이터를 설명하는 직렬화 가능한 객체 또는 클래스 있습니다.
MyAppNavHost 컴포저블에는 NavController 인스턴스가 있습니다.
따라서 navigate() 호출은 ProfileScreen과 같은 하위 컴포저블이 아니라 여기서 발생해야 합니다.
ProfileScreen에는 클릭 시 사용자를 FriendsList로 이동하는 버튼이 포함되어 있습니다. 그러나 navigate() 자체를 호출하지는 않습니다.
대신 버튼은 onNavigateToFriends 매개변수로 노출되는 함수를 호출합니다.
MyAppNavHost가 탐색 그래프에 ProfileScreen를 추가하면 onNavigateToFriends navigate(route = FriendsList를 호출하는 람다를 전달합니다.
이렇게 하면 사용자가 ProfileScreen 버튼을 누를 때 FriendsListScreen로 올바르게 이동합니다.

@Serializable
object Profile
@Serializable
object FriendsList

@Composable
fun MyAppNavHost(
    modifier: Modifier = Modifier,
    navController: NavHostController = rememberNavController(),

) {
    NavHost(
        modifier = modifier,
        navController = navController,
        startDestination = Profile
    ) {
        composable<Profile> {
            ProfileScreen(
                onNavigateToFriends = { navController.navigate(route = FriendsList) },
                /*...*/
            )
        }
        composable<FriendsList> { FriendsListScreen(/*...*/) }
    }
}

@Composable
fun ProfileScreen(
    onNavigateToFriends: () -> Unit,
    /*...*/
) {
    /*...*/
    Button(onClick = onNavigateToFriends) {
        Text(text = "See friends list")
    }
}

정수 ID를 사용하여 이동

정수 ID를 사용하여 대상으로 이동하려면 navigate(int) 오버로드를 호출하세요. 작업 또는 대상의 리소스 ID를 사용합니다. 다음 코드 스니펫은 이 오버로드를 사용하여 ViewTransactionsFragment로 이동하는 방법을 보여줍니다.

Kotlin

viewTransactionsButton.setOnClickListener { view ->
  view.findNavController().navigate(R.id.viewTransactionsAction)
}

Java

viewTransactionsButton.setOnClickListener(new View.OnClickListener() {
  @Override
  public void onClick(View view) {
      Navigation.findNavController(view).navigate(R.id.viewTransactionsAction);
  }
});

ID를 사용하여 이동할 때는 가능한 경우 작업을 사용해야 합니다. 탐색 그래프에 추가 정보를 제공하여 대상이 서로 어떻게 연결되어 있는지 시각적으로 보여줍니다.

NavDeepLinkRequest를 사용하여 탐색

암시적 딥 링크 대상으로 이동하려면 navigate(NavDeepLinkRequest) 오버로드를 사용하세요. 다음 스니펫은 이 메서드의 구현을 제공합니다.

Kotlin

val request = NavDeepLinkRequest.Builder
  .fromUri("android-app://androidx.navigation.app/profile".toUri())
  .build()
findNavController().navigate(request)

Java

NavDeepLinkRequest request = NavDeepLinkRequest.Builder
  .fromUri(Uri.parse("android-app://androidx.navigation.app/profile"))
  .build()
NavHostFragment.findNavController(this).navigate(request)

작업 또는 대상 ID를 사용하는 탐색과 달리 대상이 표시되는 여부와 상관없이 그래프의 모든 딥 링크로 이동할 수 있습니다. 현재 그래프에서 대상으로 이동하거나 완전히 다른 그래프의 대상으로 이동할 수 있습니다.

작업 및 MIME 유형

Uri 외에 NavDeepLinkRequest도 작업 및 MIME 유형이 있는 딥 링크를 지원합니다. 작업을 요청에 추가하려면 fromAction() 또는 setAction()을 사용합니다. MIME 유형을 요청에 추가하려면 fromMimeType() 또는 setMimeType()을 사용합니다.

NavDeepLinkRequest가 암시적 딥 링크 대상과 올바르게 일치하려면 URI, 작업, MIME 유형이 모두 대상의 NavDeepLink와 일치해야 합니다. URI는 패턴과 일치해야 하고 작업은 정확하게 일치해야 하며 MIME 유형은 관련이 있어야 합니다. 예를 들어 image/jpg는 image/\*와 일치합니다.

추가 컨텍스트

이 문서에서는 가장 일반적인 사용 사례에서 NavController.navigate()를 사용하는 방법을 다룹니다. 그러나 함수에는 다양한 컨텍스트에서 그리고 모든 UI 프레임워크와 함께 사용할 수 있는 다양한 오버로드가 있습니다. 이러한 오버로드에 관한 자세한 내용은 참조 문서를 확인하세요.

추가 자료

자세한 내용은 다음 페이지를 참고하세요.