Ahmed Elshorbagy
Ahmed Elshorbagy

Reputation: 362

Exit YouTube fullscreen back button Cordova closes the app

I play a YouTube video in fullscreen mode, and when I press the back button, it closes the app instead of exiting the the full-screen mode. I'm using JavaScript with Cordova 6.3.1 for Android. Here is my code:

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {
   document.addEventListener("backbutton", function (e) {
     e.preventDefault();
       screen.orientation.lock('portrait');
     }, false);
}

The previous code does not work as expected.

Thanks in advance.

Upvotes: 1

Views: 320

Answers (1)

A Charron
A Charron

Reputation: 368

I haven't found the answer yet, but I'm posting my findings so far in hopes it helps someone.

Version : cordova-android 8.1.0

What I found

The problem comes from the fact that to display the Youtube video fullscreen, the SystemWebChromeClient calls the CordovaWebViewImpl.showCustomView() method. By doing so, the new view seems to catch the Back button event before Cordova is able to onDispatchKeyEvent() and send the backbutton event to the JavaScript side.

Here is some log taken, with comments added for clarity

// Video is fullscreen, and then dismissed with the onscreen minimize button
D/CordovaWebViewImpl: showCustomView : showing Custom View + view = android.widget.FrameLayout{a7cc344 V.E...... ......I. 0,0-0,0}
D/CordovaWebViewImpl: hideCustomView : Hiding Custom View : mCustomView = android.widget.FrameLayout{a7cc344 V.E...... .......D 0,0-1080,1704}

// While the video is not displayed fullscreen, the back button event is correctly caught and sent to the JS side
D/CordovaWebViewImpl: onDispatchKeyEvent : isBackButton = true mCustomView = null

// Once again in fullscreen, then click on the back button
D/CordovaWebViewImpl: showCustomView : showing Custom View + view = android.widget.FrameLayout{fa6d336 V.E...... ......I. 0,0-0,0}
// No back button event caught
// A destroy lifecycle event is sent (from the video FrameLayout handling?) and handleDestroy() is called
D/CordovaWebViewImpl: handleDestroy : load about:blank
D/CordovaWebViewImpl: >>> loadUrl(about:blank)
W/cr_AwContents: WebView.destroy() called while WebView is still attached to window.
D/CordovaWebViewImpl: hideCustomView : Hiding Custom View : mCustomView = android.widget.FrameLayout{a7cc344 V.E...... .......D 0,0-1080,1704}

What I tried

  • Create a subclass of FrameLayout, with overrides for onKeyDown() and onKeyUp(), use it in showCustomerView()

The video then wasn't displayed anymore.

Docs

Upvotes: 1

Related Questions