[Navigation Animation] Double clicks launch the destination twice

[mkano9]

Description
When I quickly click twice on a button that launches a navigation, the button receives the click events twice and the navigation triggers twice. I'm not able to reproduce this on the regular compose navigation component library.

If this is the expected behavior, what can I do to prevent it from launching the navigation twice?

Steps to reproduce
I integrated the accompanist anim navigation library in the Rally app from the compose codelab to reproduce. Click twice quickly on the "See all" button from Home. The branch is end-repro.

Repo: https://github.com/mkano9/android-compose-codelabs/tree/end-repro

Changes I made: https://github.com/mkano9/android-compose-codelabs/compare/end...mkano9:android-compose-codelabs:end-repro?expand=1

Expected behavior
It should not launch the new screen twice.

Additional context
Video:
https://user-images.githubusercontent.com/100639909/188287727-af4945cb-9792-4571-8241-620844a02d5e.mov

[alexvanyo]

I believe this is expected behavior, since clicks that result in two navigate calls will cause navigation to occur twice.

The button is still interactable as it is animating out, so if that button directly causes a navigate call, it's possible to navigate twice as you're seeing.

One approach to avoid this is to check if the lifecycle of the current destination is no longer resumed, and in that case, drop the event that will cause navigation. An example of that is in Jetsnack:

https://github.com/android/compose-samples/blob/081721ad44dfb29b55b1bc34f83d693b6b8dc9dd/Jetsnack/app/src/main/java/com/example/jetsnack/ui/JetsnackAppState.kt#L141-L147

Calling navigate will synchronously cause the old destination to no longer be resumed, and therefore the second click will not result in a second navigate call.

[MarcelReiter]

LaunchSingleTop is the easiest solution. On click do:

navController.navigate(myFeatureNavGraph) { launchSingleTop = true }

[Oved]

You can use Modifier.combinedClickable and set the onDoubleClick empty; Modifier.combinedClickable(
onDoubleClick = { },
onClick = { /yourClick()/ }
}