DialogFragment does not dismiss when using Navigation Components

Question

I am new to Navigation Component and I want to use it with a custom Dialog Fragment.

Here is my nav_graph

    <dialog
        android:id="@+id/enterAisleNameDialog"
        android:name="com.cbplus.scan_product.view.EnterAisleNameDialog"
        android:label="EnterAisleNameDialog">
    <action
            android:id="@+id/action_enterAisleNameDialog_to_scanSummaryFragment"
            app:destination="@id/scanSummaryFragment"/>
</dialog>

In my Kotlin Activity, I am easily able to display the dialog using:

navController?.navigate(R.id.action_validateProductExpFragment_to_enterAisleNameDialog)

Then, when the action is done on the dialog, I call:

navController?.navigate(R.id.action_enterAisleNameDialog_to_scanSummaryFragment)

But here the next Fragment gets displayed underneath the dialog fragment which does not go away.

I am missing something in my implementation ?

I could be calling dismiss() on the dialog, but it seems strange that the Nav Controller is not doing it.

Answer 1

The next fragment you are calling is a Fragment while the current one is a DialogFragment. The dialog fragment, a FloatingWindow in Nav Components, is displayed above the dialog.

You may dismiss the dialog before navigating by calling:

navController?.popBackStack()

or

navController?.popBackStack(R.id.your_dialogfragment_id, true)

Even better, you could define your action R.id.action_enterAisleNameDialog_to_scanSummaryFragment to automatically pop the dialog by specifying popUpTo for the action. Specify the dialog itself as the popUpTo destination, and set popInclusive to true.

Now when you navigate to this action, it'll first pop off (dismiss) the dialog, and then navigate to your fragment.

popUpTo