대상으로 이동

탐색 구성요소는 대상으로 이동하는 간단하고 일반적인 방법을 제공합니다. 이 인터페이스는 다양한 컨텍스트와 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() 호출을 전달합니다.

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

예

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

  1. 그래프의 각 대상은 직렬화에 필요한 데이터를 설명하는 직렬화 가능한 객체 또는 클래스 있습니다.
  2. MyAppNavHost 컴포저블에는 NavController 인스턴스가 있습니다.
  3. 따라서 navigate() 호출은 ProfileScreen과 같은 하위 컴포저블이 아니라 여기서 발생해야 합니다.
  4. ProfileScreen에는 클릭 시 사용자를 FriendsList로 이동하는 버튼이 포함되어 있습니다. 그러나 navigate() 자체를 호출하지는 않습니다.
  5. 대신 버튼은 onNavigateToFriends 매개변수로 노출되는 함수를 호출합니다.
  6. MyAppNavHost가 탐색 그래프에 ProfileScreen를 추가하면 onNavigateToFriends navigate(route = FriendsList를 호출하는 람다를 전달합니다.
  7. 이렇게 하면 사용자가 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 프레임워크와 함께 사용할 수 있는 다양한 오버로드가 있습니다. 이러한 오버로드에 관한 자세한 내용은 참조 문서를 확인하세요.

추가 자료

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