Recyclerview Item Onclick Overlays The Next Fragment Instead Of Replacing It

I have these activity, fragments, its viewmodels, and their adapter. I can already call the next fragment on click of a recyclerview item, but the new fragment overlays on the firs

Solution 1:

Remove these lines:

if (savedInstanceState == null) {
    supportFragmentManager
        .beginTransaction()
        .add(R.id.fragment_home, HomeFragment.newInstance(), "dormList")
        .commit()
}

You're adding one HomeFragment via the NavHostFragment and another manually. You don't need to manually add Fragment when using Navigation.

You should also be updating your onRecyclerViewItemClick to use navigate() as per the Navigate to a destination documentation:

overridefunonRecyclerViewItemClick(view: View, dorms: Dorms) {
    val navController = findNavController(R.id.nav_host_fragment)
    // If you're using Safe Args, use the ID generated from// the navigation graph and make sure you have// an argument of the correct type
    navController.navigate(
        HomeFragmentDirections.actionHomeToDetails(dorms))
}

You might find it helpful to look at the Pass data between destinations documentation to see how to create an <argument> in your graph for your Dorms object and how to set up Safe Args to generate the Directions class for you.