web-dev-qa-db-ja.com

WebViewでYouTubeビデオをロードするとき、全画面オプションは使用できません

Androidアプリでwebviewを何度も使用していますが、今回はYouTubeビデオをWebViewにロードするときに奇妙な問題が発生しました。

これは、Chromeブラウザに読み込まれたYouTubeビデオのスクリーンショットです。フルスクリーンオプションが含まれています。

enter image description here

以下は、webviewに同じビデオを読み込んだアプリのスクリーンショットです。しかし、その全画面オプションはありません。

enter image description here

両方の画像で変更を確認できます。両方のスクリーンショットは同じデバイスから取得されています。しかし、それでも見た目は異なります。

WebViewロードの私のコードは このペーストボード内 です。

更新

同じ問題が ここで報告 であることも確認しました。しかし、その解決策が利用できるかどうかはわかりません。

javascriptandroidwebviewyoutubeandroid-webview
9
Shreyash Mahajan

iFrameはオプションですが、これを試すことができます

完全に機能するHTML5ビデオのサポートを可能にするAndroidのWebViewおよびWebChromeClientクラス拡張

VideoEnabledWebView

私はまだこれを試していませんが、お役に立てば幸いです。

8
M D

Javaファイルで次の変更を行います。

view.setWebViewClient(new Browser());
view.setWebChromeClient(new MyWebClient());

JavaファイルにクラスBrowserとクラスMyWebClientであるこの2つのクラスを追加します

class Browser
        extends WebViewClient
{
    Browser() {}

    public boolean shouldOverrideUrlLoading(WebView paramWebView, String paramString)
    {
        paramWebView.loadUrl(paramString);
        return true;
    }
}

public class MyWebClient
        extends WebChromeClient
{
    private View mCustomView;
    private WebChromeClient.CustomViewCallback mCustomViewCallback;
    protected FrameLayout mFullscreenContainer;
    private int mOriginalOrientation;
    private int mOriginalSystemUiVisibility;

    public MyWebClient() {}

    public Bitmap getDefaultVideoPoster()
    {
        if (MainActivity.this == null) {
            return null;
        }
        return BitmapFactory.decodeResource(MainActivity.this.getApplicationContext().getResources(), 2130837573);
    }

    public void onHideCustomView()
    {
        ((FrameLayout)MainActivity.this.getWindow().getDecorView()).removeView(this.mCustomView);
        this.mCustomView = null;
        MainActivity.this.getWindow().getDecorView().setSystemUiVisibility(this.mOriginalSystemUiVisibility);
        MainActivity.this.setRequestedOrientation(this.mOriginalOrientation);
        this.mCustomViewCallback.onCustomViewHidden();
        this.mCustomViewCallback = null;
    }

    public void onShowCustomView(View paramView, WebChromeClient.CustomViewCallback paramCustomViewCallback)
    {
        if (this.mCustomView != null)
        {
            onHideCustomView();
            return;
        }
        this.mCustomView = paramView;
        this.mOriginalSystemUiVisibility = MainActivity.this.getWindow().getDecorView().getSystemUiVisibility();
        this.mOriginalOrientation = MainActivity.this.getRequestedOrientation();
        this.mCustomViewCallback = paramCustomViewCallback;
        ((FrameLayout)MainActivity.this.getWindow().getDecorView()).addView(this.mCustomView, new FrameLayout.LayoutParams(-1, -1));
        MainActivity.this.getWindow().getDecorView().setSystemUiVisibility(3846);
    }
}
28
Ameya Bonkinpelliwar

私が正しく理解していれば、2番目のiframe（youtube 1）を含むiframeがあります。 「親」のiframeにallowfullscreen属性を追加してみてください。

完全なブラウザサポートの場合、次のようになります：

<iframe src="your_page_url" allowfullscreen="allowfullscreen" mozallowfullscreen="mozallowfullscreen" msallowfullscreen="msallowfullscreen" oallowfullscreen="oallowfullscreen" webkitallowfullscreen="webkitallowfullscreen"> </iframe>
2
Rohit Jindal
//Add WebChromeClient to your webview 
//With navigation option and player controls overlapping handlled.

    class UriChromeClient extends WebChromeClient {
            private View mCustomView;
            private WebChromeClient.CustomViewCallback mCustomViewCallback;
            protected FrameLayout mFullscreenContainer;
            private int mOriginalOrientation;
            private int mOriginalSystemUiVisibility;

            @SuppressLint("SetJavaScriptEnabled")
            @Override
            public boolean onCreateWindow(WebView view, boolean isDialog,
                                          boolean isUserGesture, Message resultMsg) {
                mWebviewPop = new WebView(getApplicationContext());
                mWebviewPop.setVerticalScrollBarEnabled(false);
                mWebviewPop.setHorizontalScrollBarEnabled(false);
                mWebviewPop.setWebViewClient(new MyWebViewClient());
                mWebviewPop.getSettings().setSupportMultipleWindows(true);
                mWebviewPop.getSettings().setJavaScriptEnabled(true);
                mWebviewPop.getSettings().setUserAgentString(mWebviewPop.getSettings().getUserAgentString().replace("; wv", ""));
    //            mWebviewPop.getSettings().setUserAgentString(USER_AGENT);
                mWebviewPop.getSettings().setSaveFormData(true);
                mWebviewPop.setLayoutParams(new FrameLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT,
                        ViewGroup.LayoutParams.MATCH_PARENT));
                mContainer.addView(mWebviewPop);
                WebView.WebViewTransport transport = (WebView.WebViewTransport) resultMsg.obj;
                transport.setWebView(mWebviewPop);
                resultMsg.sendToTarget();

                return true;
            }

            @Override
            public void onCloseWindow(WebView window) {
                Log.d("onCloseWindow", "called");
            }

            //
            public Bitmap getDefaultVideoPoster() {
                if (mCustomView == null) {
                    return null;
                }
                return BitmapFactory.decodeResource(getApplicationContext().getResources(), 2130837573);
            }

            public void onHideCustomView() {
                ((FrameLayout) getWindow().getDecorView()).removeView(this.mCustomView);
                this.mCustomView = null;
                getWindow().getDecorView().setSystemUiVisibility(this.mOriginalSystemUiVisibility);
                setRequestedOrientation(this.mOriginalOrientation);
                this.mCustomViewCallback.onCustomViewHidden();
                this.mCustomViewCallback = null;
            }

            public void onShowCustomView(View paramView, WebChromeClient.CustomViewCallback paramCustomViewCallback) {
                if (this.mCustomView != null) {
                    onHideCustomView();
                    return;
                }
                this.mCustomView = paramView;
                this.mCustomView.setBackgroundColor(Color.BLACK);
                this.mOriginalSystemUiVisibility = getWindow().getDecorView().getSystemUiVisibility();
                this.mOriginalOrientation = getRequestedOrientation();
                this.mCustomViewCallback = paramCustomViewCallback;
                ((FrameLayout) getWindow().getDecorView()).addView(this.mCustomView, new FrameLayout.LayoutParams(-1, -1));
                getWindow().getDecorView().setSystemUiVisibility(3846);

                this.mCustomView.setOnSystemUiVisibilityChangeListener(new View.OnSystemUiVisibilityChangeListener() {
                    @Override
                    public void onSystemUiVisibilityChange(int visibility) {
                        if ((visibility & View.SYSTEM_UI_FLAG_HIDE_NAVIGATION) == 0) {
                            updateControls(getNavigationBarHeight());
                        } else {
                            updateControls(0);
                        }

                    }
                });

            }

            void updateControls(int bottomMargin) {
                FrameLayout.LayoutParams params = (FrameLayout.LayoutParams) this.mCustomView.getLayoutParams();
                params.bottomMargin = bottomMargin;
                this.mCustomView.setLayoutParams(params);
            }
        }

        int getNavigationBarHeight() {
            Resources resources = getResources();
            int resourceId = resources.getIdentifier("navigation_bar_height", "dimen", "Android");
            if (resourceId > 0) {
                return resources.getDimensionPixelSize(resourceId);
            }
            return 0;
        }


        private void loadURL(WebView view, String url) {
            ConnectivityManager cm = (ConnectivityManager) getApplication().getSystemService(Context.CONNECTIVITY_SERVICE);
            NetworkInfo netInfo = cm.getActiveNetworkInfo();
            if (netInfo != null && netInfo.isConnected()) {
                view.setVisibility(View.VISIBLE);
                noNetworkText.setVisibility(View.GONE);
                view.loadUrl(url);

            } else {
                Log.d(TAG, "loadURL: no network");
                view.setVisibility(View.INVISIBLE);
                noNetworkText.setVisibility(View.VISIBLE);
            }
        }

    }
0
user2869895