Android back button close slide up panel instead of going back

[AsadSaleh]

Issue Description:

Android 'back button' close the slide up panel that lives in the previous screen instead of going back to previous screen.

How to reproduce:

I'm using react-navigation.

1. I have two screens, A and B.
2. On screen A, I open my slide up panel. Inside it, I click on a button to navigate to screen B (panel still opened in screen A).
3. On Screen B, I press the 'android back button' to bring me back (to screen A) but what actually happened is it tries to close the "still opened panel in screen A" first, then just after it completely closed the back button can be used properly to go back to screen A.

This has 2 downsides:

1. The feeling of unresponsiveness, as the first press will not do anything in the currently active screen.
2. The feeling of something is missing in the previous screen. When you go back, you want the previous screen position to be where you left it.

Note: This doesn't happen if I press 'back' using the top nav bar.

I cannot propose any solution yet, can anyone please help?

Environment

• Version:"^2.3.1"
• React Native version: "0.59.10"
• Platform(s) (iOS, Android, or both?): Android (iOS don't have back button)
• Device info (Simulator/Device? OS version? Debug/Release?): Real Android Device, Realme 2 Pro, Android 9, Debug & Release.

[octopitus]

In this case you must provide onBackButtonPress prop and handle back button yourself. A bit inconvenient because the panel doesn't know about your navigator stack.

handleBackButton() {
  if (this.props.navigation.isFocused()) {
    return false
  }

  // Or simply return !this.props.isFocused() if readability is not your concern.
  return true
}

<SlidingUpPanel onBackButtonPress={this.handleBackButton} />