Cannot hide iOS home indicator in fullscreen

[luckner]

Context:
I successfully implemented fullscreen with the React Native player: GitHub - bitmovin/bitmovin-player-react-native: Official React Native bindings for Bitmovin's Mobile Player SDKs.

Current behavior:
When watching a video in fullscreen, if I don’t interact with the screen for a few seconds, the player’s controls fade out, but the home indicator does not fade out. It stays visible. (The home indicator is the bar at the bottom of the screen, which allows the user to return to the device’s home screen when dragging it up, among other things.)

Expected behavior:
The home indicator also fades out if I don’t interact with the screen for a few seconds, like it’s the case on Youtube and Twitch apps, for instance.

How can I hide the home indicator in fullscreen?

Thank you for any help!

Details:

• I am using latest version as of Nov. 15 2023

• Here is an example of a similar issue in a different repository : Iphone X hide home indicator when playing in fullscreen · Issue #1397 · react-native-video/react-native-video · GitHub

• I will also attach a screenshot of my issue with Bitmovin :
  

  

• I was expecting the home indicator to fade out, or at least to find APIs to hide it, since it feels pretty important for a video player. And Bitmovin already offers APIs of that kind, such as AudioSession to enable sound on iOS for picture-in-picture or to bypass silent mode. However I couldn’t find anything in the documentation or in the examples provided by Bitmovin (https://github.com/bitmovin/bitmovin-player-react-native/tree/development/example and GitHub - bitmovin/bitmovin-player-ios-samples). In the Bitmovin app available on the stores, the home indicator never disappears either.

• I don’t know much about native iOS development but I know Apple provides at least setNeedsUpdateOfHomeIndicatorAutoHidden() and prefersHomeIndicatorAutoHidden.

[roland.kakonyi (Roland Kákonyi)]

Hi @luckner!

Thank you for your post and the research on the iOS APIs!

We will showcase how to do this when using React Navigation in our example application and on our documentation page soon.
Until then, please see how this can be done on this open Pull Request

[luckner]

Hi @roland.kakonyi,

Thanks for the answer! I didn’t think of using navigation.setOptions() to set autoHideHomeIndicator when activating the fullscreen. I’ll mark it as a solution if I get it to work.

I just want to note that this requires using React Navigation and a native stack navigator. In my case that’s fine because I use both now (the stack I used before wasn’t a native stack, but refactoring was easy).
Are there ways to work without it? I assume most mobile developers use React Navigation or something that uses it under the hood, so that would probably not matter to many people, but I wonder if it’s possible.

[roland.kakonyi (Roland Kákonyi)]

Hi @luckner!

I would say that is an application specific problem, like with React Navigation, you can see this didn’t need any interaction with the Bitmovin Player SDK. Therefore each application has to handle this on their own, depending on what frameworks they use.

[luckner]

Understood. Thanks for the explanations!