TheWidlarzGroup / react-native-video

A <Video /> component for react-native
http://thewidlarzgroup.github.io/react-native-video/
MIT License
7.14k stars 2.88k forks source link

[BUG]: dismiss video player hides statusbar and navigation bar #4107

Closed mkbhdana closed 1 week ago

mkbhdana commented 3 weeks ago

Version

6.4.5

What platforms are you having the problem on?

Android

System Version

Android 14

On what device are you experiencing the issue?

Real device

Architecture

Old architecture

What happened?

A bug happened! after playing video and then exiting statusbar gets hidden and does not shows up until i swipe down and again gets hidden is seconds

Reproduction Link

repository link

Reproduction

Step to reproduce this bug are: play video in fullscreen mode from a list and then return to list screen. Observe statusbar and navigation bar not returning to original state

moskalakamil commented 3 weeks ago

Hi, thanks for reporting the issue!

ChadyAyoub4 commented 3 weeks ago

same, also, removing the video component without setting fullscreen to false keeps the app in fullscreen, this used to work correctly in v5, @mkbhdana i am using a workaround currently waiting for this to be fixed. Do not set fullscreen prop in video instead use react-native-system-navigation-bar and hide the navigation bar along with the <StatusBar component from react native to hide the status bar. you can also use the package to set the app in fullscreen or in immersive mode however in my case i am having the same issue as the player fullscreen so i have to use navigationHide with the status bar.

tacianoscur commented 3 weeks ago

same issue for me. it was working in 5.x but when upgraded to 6.x happens the same thing, specially the navigation bar

mkbhdana commented 3 weeks ago

same, also, removing the video component without setting fullscreen to false keeps the app in fullscreen, this used to work correctly in v5, @mkbhdana i am using a workaround currently waiting for this to be fixed. Do not set fullscreen prop in video instead use react-native-system-navigation-bar and hide the navigation bar along with the <StatusBar component from react native to hide the status bar. you can also use the package to set the app in fullscreen or in immersive mode however in my case i am having the same issue as the player fullscreen so i have to use navigationHide with the status bar.

i solved my issue this way

i just used react-native-system-navigation-bar this library and calling SystemNavigationBar.fullScreen(false); on onBack handler and this solves my entire problem with status and navigation bar while keeping fullscreen={true} in react native video component

tacianoscur commented 3 weeks ago

@mkbhdana which hook did you use to call SystemNavigationBar.fullScreen(false);? I can't seem to make it work

seyedmostafahasani commented 3 weeks ago

I think it will be fixed with this PR (#4112).

freeboub commented 1 week ago

linked PR merged, will be available in next release

Danik711 commented 1 week ago

Hello @freeboub, may you please share when do you plan to make a new release, or would it be better to downgrade for now? For my purposes I need the fix or work-around quite soon. I am definetely not rushing you guys

freeboub commented 1 week ago

I should build it before the end of the week !

freeboub commented 1 week ago

It is already released !

amit-lekhak commented 1 week ago

Hey guys, great work. The status bar and navigation bars (app bar and bottom nav bar) seem to be hiding and showing properly in android.

Quick question @freeboub : Is it just me or the latest update broke the whole video playback functionality?

{"error": {"errorCode": "1001", "errorException": "java.lang.IndexOutOfBoundsException: index=1 count=0", "errorStackTrace": "java.lang.IndexOutOfBoundsException: index=1 count=0 at android.view.ViewGroup.addInArray(ViewGroup.java:5404) at android.view.ViewGroup.addViewInner(ViewGroup.java:5297) at android.view.ViewGroup.addView(ViewGroup.java:5104) at com.brentvatne.exoplayer.ReactExoplayerView.addPlayerControl(ReactExoplayerView.java:513) at com.brentvatne.exoplayer.ReactExoplayerView.setControls(ReactExoplayerView.java:2344) at com.brentvatne.exoplayer.ReactExoplayerView.finishPlayerInitialization(ReactExoplayerView.java:888) at com.brentvatne.exoplayer.ReactExoplayerView.initializePlayerSource(ReactExoplayerView.java:882) at com.brentvatne.exoplayer.ReactExoplayerView.lambda$initializePlayer$6(ReactExoplayerView.java:692) at com.brentvatne.exoplayer.ReactExoplayerView.$r8$lambda$CmLk1POlizDjARVrkea3Gsb1vzc(Unknown Source:0) at com.brentvatne.exoplayer.ReactExoplayerView$$ExternalSyntheticLambda6.run(Unknown Source:4) at android.os.Handler.handleCallback(Handler.java:958) at android.os.Handler.dispatchMessage(Handler.java:99) at android.os.Looper.loopOnce(Looper.java:205) at android.os.Looper.loop(Looper.java:294) at android.app.ActivityThread.main(ActivityThread.java:8177) at java.lang.reflect.Method.invoke(Native Method) at com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:552) at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:971) ", "errorString": "java.lang.IndexOutOfBoundsException: index=1 count=0"}}

Screenshot 2024-09-04 at 10 57 35 PM
freeboub commented 1 week ago

Looks like an issue with controls, I will check quickly. Maybe an issue when controls are enable by default...

amit-lekhak commented 1 week ago

My implementation Info, if needed(with 6.4.5): <Video source={{ uri: localFile }} resizeMode='cover' controls={true} // here paused={isPaused} fullscreen={true} // here onLoad={onLoad} onEnd={closeModal} onError={onError} ref={player} style={videoStyles.container} />

 1. With controls=false, error doesn't occur
 2. With fullScreen=true, video isn't visible
 3. With controls=false and fullScreen=false, on hardware back press: status bar and hardware buttons becomes visible and controls are hidden.
 On second back press, player closes. Is this by design?
seyedmostafahasani commented 1 week ago

Looks like an issue with controls, I will check quickly. Maybe an issue when controls are enable by default...

I think if we release a new version after merging this PR(#3914) we can close this issue. WDYT?

freeboub commented 1 week ago

@amit-lekhak This issue is linked to fullscreen={true} at component mount. fullscreen is opening a dialog and display the video fullscreen. I think we should remove this prop or at least deprecate it. I can add a note in doc indicating this or complete @seyedmostafahasani PR (https://github.com/TheWidlarzGroup/react-native-video/pull/3914)

For point 3. I am not sure I understand your point, but it should be tested with 6.5.0 release, not 6.4.5

freeboub commented 1 week ago

let's close again this issue and handle documentation update in the other PR