Open PiP from Background iOS React Native

Hello!

I am trying to auto open PiP mode when the app is set into the background. Currently Pip mode does not open automatically, and a user has to click the PiP icon on the video player.

I have setup the player with:

  const player = usePlayer({
    nativeId: 'bitmovin',
    playbackConfig: {
      isBackgroundPlaybackEnabled: true,
      isPictureInPictureEnabled: true,
    },
  });

And using these props:

<PlayerView
          player={player}
          isPictureInPictureRequested={isPip}
          config={{
            pictureInPictureConfig: {
              isEnabled: true,
              shouldEnterOnBackground: true,
            },
          }}
        />

isPip is toggling correctly between true/false when the app goes to the background, but this is not affecting the UI.

PiP mode is working correctly when opened from the video player icon.

I have updated the package to the latest version "bitmovin-player-react-native": "^0.15.0", and running iOS 17.2.
In my iOS device settings, Start PiP Automatically is enabled.

Is there a different setting I could try, or is auto open not a supported feature? Thanks!

Hi @brantleyenglish!

Do you intend to enter PiP while the player is in playing state or paused state?
On iOS, the player only enters PiP automatically when the player is playing.

Are you sure you configured the “Audio, AirPlay, and Picture in Picture” Capability via Xcode as stated here?

I tried this with our example application from our repo here: GitHub - bitmovin/bitmovin-player-react-native: Official React Native bindings for Bitmovin's Mobile Player SDKs.

This was built the same way as stated in our guide here: Enabling Picture in Picture mode

FYI shouldEnterOnBackground option is only necessary when the <PlayerView> is not taking up the whole width of the screen, as by default iOS only enters PiP automatically during playback for “main content”, which is determined by the player view’s usage of the full width.

I hope this helps.
Let us know if you have further problems!

I believe it is setup correctly. Audio, AirPlay, and PiP is enabled.
CleanShot 2024-01-09 at 10.51.10@2x

And the AudioSession in App.tsx is not logging any errors.

  useEffect(() => {
    AudioSession.setCategory('playback').catch((error) => {
      console.log(
        "[BasicFullscreen] Failed to set app's audio category to `playback`:\n",
        error,
      );
    });
  }, []);

The background audio from a video continues to play when the app goes to the background, but PiP is not visible.
Here is a recording of that: https://cargo.teamairship.com/v/ydmw7W

Is there something else I should look at?
Thanks so much!

@roland.kakonyi Thank you for your help pointing me towards the example app.
I ran that locally, and it worked correctly.
The only difference between the setups I found was the RN version. I updated my local app from .71 to .72 and that seems to have resolved the iOS issue for me!

1 Like

This topic was automatically closed 60 minutes after the last reply. New replies are no longer allowed.