apache / apache/cordova-plugin-inappbrowser
Update pages opened by InAppBrowser to allow for full screen elements
- Dominant language
- Java
- Stars
- 1.1k
- Forks
- 2.2k
- PR merge metrics
- No merged PRs in 30d
Description
# Feature Request
## Motivation Behind Feature
Currently, a web pages opened via the InAppBrowser has document.fullscreenEnabled always set to false which means a user cannot view an item in a full screen mode (e.g. video, map, image, etc.).
## Feature Description
For Android:
The web view client should be updated to set the onShowCustomView and onHideCustomView methods so the document.fullscreenEnabled flag is set to true
For ios:
This feature looks to be disabled/not supported on the mobile safari browser (WKWebView engine), but I could be mistaken.
On the normal safari browser it sets the document.webkitFullscreenEnabled to true
## Alternatives or Workarounds
For Android:
To have the opened web pages allow full screen elements the web view client must have the onShowCustomView and onHideCustomView methods.
Adding the following/something similar (with the dependent imports) to the initialized InAppChromeClient in InAppBorwser showWebPage runnable's run method (where you are declaring the onShowFileChooser/openFileChooser methods)
(code taken from the cordova engine's SystemWebCromeClient and modified to work)
````
private View mCustomView;
private WebChromeClient.CustomViewCallback mCustomViewCallback;
public void onShowCustomView(View view, WebChromeClient.CustomViewCallback callback) {
// This code is adapted from the original Android Browser code, licensed under the Apache License, Version 2.0
LOG.d(LOG_TAG, "showing Custom InAppBrowser View");
// if a view already exists then immediately terminate the new one
if (mCustomView != null) {
callback.onCustomViewHidden();
return;
}
// Store the view and its callback for later (to kill it properly)
mCustomView = view;
mCustomViewCallback = callback;
// Add the custom view to its container.
ViewGroup parent = (ViewGroup) inAppWebView.getParent();
parent.addView(view, new FrameLayout.LayoutParams(
WindowManager.LayoutParams.MATCH_PARENT,
WindowManager.LayoutParams.MATCH_PARENT,
Gravity.CENTER));
// Hide the content view.
inAppWebView.setVisibility(View.GONE);
// Finally show the custom view container.
parent.setVisibility(View.VISIBLE);
parent.bringToFront();
}
public void onHideCustomView() {
// This code is adapted from the original Android Browser code, licensed under the Apache License, Version 2.0
if (mCustomView == null) return;
LOG.d(LOG_TAG, "Hiding Custom InAppBrowser View");
// Hide the custom view.
mCustomView.setVisibility(View.GONE);
// Remove the custom view from its container.
ViewGroup parent = (ViewGroup) inAppWebView.getParent();
parent.removeView(mCustomView);
mCustomView = null;
mCustomViewCallback.onCustomViewHidden();
// Show the content view.
inAppWebView.setVisibility(View.VISIBLE);
}
````
For ios:
Good luck?
Contributor guide
Research direction
Start in the InAppBrowser showWebPage runnable, where the initialized InAppChromeClient declares onShowFileChooser/openFileChooser methods. Review the Android WebView client and the corresponding iOS WKWebView behavior, then verify that pages report fullscreen support and that custom views can be shown and hidden.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- android, ios, java
- Domain
- mobile-dev
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100