Home > Blockchain >  java.lang.IllegalArgumentException when navigate with argument in Navigation Android Compose
java.lang.IllegalArgumentException when navigate with argument in Navigation Android Compose

Time:02-06

I'm running into a problem when trying to navigate with argument in my very first compose project
Error:

java.lang.IllegalArgumentException: Navigation destination that matches request NavDeepLinkRequest{ uri=android-app://androidx.navigation/transaction_detail/{1} } cannot be found in the navigation graph NavGraph...

My NavGraph:

@Composable
fun SetupNavGraph(
    navController: NavHostController
) {
    NavHost(
        navController = navController,
        startDestination = HomeDestination.route,
    ) {
        composable(route = HomeDestination.route) {
            HomeScreen(
                navigateToItemEntry = { navController.navigate(TransactionEntryDestination.route) },
                navigateToItemUpdate = {
                    navController.navigate("${TransactionDetailDestination.route}/{$it}")
                }
            )
        }

        //detail screen route
        composable(
            route = TransactionDetailDestination.routeWithArgs,
            arguments = listOf(
                navArgument(TransactionDetailDestination.transactionIdArg) {
                    type = NavType.IntType
                }
            )
        ) {
            val id = it.arguments?.getInt(TransactionDetailDestination.transactionIdArg)!!
            TransactionDetailScreen(id)
        }
    }
}
    

My transaction detail screen:

object TransactionDetailDestination : NavigationDestination {
    override val route  = "transaction_detail"
    override val title = "Transaction Detail Screen"
    const val transactionIdArg = "transactionId"
    val routeWithArgs = "$route/{$transactionIdArg}"
}

@Composable
fun TransactionDetailScreen(id: Int) {
    Scaffold {
        TransactionDetailBody(paddingValues = it, id = id)
    }
}

@Composable
fun TransactionDetailBody(
    paddingValues: PaddingValues,
    id: Int
) {
    Column(modifier = Modifier.fillMaxSize()) {
        Text(text = "$id", fontSize = 100.sp)
        ...
    }
}

I can see that the problem is the route to transaction detail destination, but I don't know where to correct. I'm looking forward to every suggestion!

CodePudding user response:

By research on internet a lot a realize that when specify the route to go, in my case, always like this:

//'it' is the argument we need to send
//rule: 'route/value1/value2...' where 'value' is what we trying to send over
navController.navigate("${TransactionDetailDestination.route}/$it") 

The string of the route we need to extract the argument(s) from:

//notice the naming rule: 'route/{arg1}/{arg2}/...'
val routeWithArgs = "${route}/{${transactionIdArg}}" 

Only be doing the above the compiler will understand the argument you are trying to send and receive. My mistake not reading carefully. Hope it helps!

CodePudding user response:

I think you didn't declare your destination argument in your graph like this

composable("transaction_detail/{id}")

according to this documentation

  • Related