Android webview中的iframe视频无法进入全屏模式

Question

我目前正在开发一款基于网站的Android应用程序。已经存在iOS应用程序，因此我必须遵守某些代码以保持统一性。

几乎所有的事情都已完成，但是我刚刚发现了一个有趣的问题：当使用Webview（我无法控制显示的页面）查看带有iframe视频（Youtube，Dailymotion）的页面时，即使我按下播放器的按钮，视频也不会全屏。

我已经尝试了这里找到的几乎所有方法，但这些方法只适用于我知道需要显示哪些页面的应用程序。

这是应用程序中webActivity部分的代码：

public class WebActivity extends Activity {
    String targetURL = "";
    String title = "";
    WebView wv;

    @Override
    public void onResume() { super.onResume(); CookieSyncManager.getInstance().startSync(); }
    @Override
    public void onPause() { super.onPause();  CookieSyncManager.getInstance().stopSync(); }

    /** Called when the activity is first created. */
    @SuppressLint("SetJavaScriptEnabled")
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        getWindow().requestFeature(Window.FEATURE_PROGRESS);
        //getWindow().requestFeature(Window.FEATURE_NO_TITLE);
        CookieSyncManager.createInstance(getApplicationContext());
        CookieSyncManager.getInstance().startSync();
        CookieManager.getInstance().setAcceptCookie(true);
        /**
         * TODO: WebView Cookie management.
         * Right now, a cookie is hardcoded here into the WebView instead of getting it from the API called by HttpClient when retrieving the JSON.
         * Need to make things cleaner.
         */
        CookieManager.getInstance().setCookie("http://www.blabla.fr/mobile/","gbapi=1; Domain=.www.blabla.fr"); 
        /**
         * Get parameters
         */
        Bundle b = getIntent().getExtras();
        if(b != null)
        {
            targetURL = b.getString("url");
            title = b.getString("title");
        }

        setTitle(title);
        setContentView(R.layout.activity_webview);

        wv = (WebView) findViewById(R.id.webview);

        WebSettings wvSettings = wv.getSettings();

        // WebView options
        wvSettings.setDefaultTextEncodingName("utf-8");
        wvSettings.setJavaScriptEnabled(true);
        wvSettings.setPluginState(PluginState.ON);
        wvSettings.setJavaScriptCanOpenWindowsAutomatically(true);
        wvSettings.setBuiltInZoomControls(true);
        final Activity activity = this;
        wv.setWebChromeClient(new WebChromeClient() {
            public void onProgressChanged(WebView view, int progress) {
                activity.setProgress(progress * 100);
            }
        });

        wv.setWebViewClient(new WebViewClient() {
            public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
                Toast.makeText(activity, "Oh snap! " + description, Toast.LENGTH_SHORT).show();
            }
        });

        wv.loadUrl(targetURL);
    }
}

感谢任何帮助。

- user1769473

Answer 1

您需要创建一个定制的 WebChromeClient，处理 onShowCustomView 的两个版本（在 API 级别 14 中引入了此回调的新版本），以及 onHideCustomView。基本上，当您尝试播放全屏视频时，您将获得某种 VideoView 变体的视图。您需要将其附加到全屏 FrameLayout 上，并将其粘贴到布局层次结构的根部，以覆盖整个屏幕。一旦完成，您就需要再次将其删除。

这是我正在使用的播放视频的版本

private class DerpChromeClient extends WebChromeClient implements MediaPlayer.OnCompletionListener, MediaPlayer.OnErrorListener {
    //@Override
    public void onShowCustomView(View view, int requestedOrientation, CustomViewCallback callback) {
        log.warn("onShowCustomView");
        showCustomView(view, callback);
    }

    private View mVideoProgressView;

    @Override
    public void onHideCustomView() {
        super.onHideCustomView();

        activity.removeFullscreenView();
        webView.setVisibility(View.VISIBLE);

        try {
            mCustomViewCallback.onCustomViewHidden();
        } catch (NullPointerException npe) {
            // occasionally Android likes to freak out and throw an unhandled NPE if it can't play the video
            // therefore we are not going to do anything but eat this exception so it fails gracefully
        }

        mCustomView = null;
        mVideoView = null;
    }

    @Override
    public void onShowCustomView(View view, CustomViewCallback callback) {
        super.onShowCustomView(view, callback);
        log.warn("onShowCustomView");
        showCustomView(view, callback);
    }

    private void showCustomView(View view, CustomViewCallback callback) {
        if (mCustomView != null) {
            callback.onCustomViewHidden();
            return;
        }

        mCustomView = view;
        mCustomViewCallback = callback;
        webView.setVisibility(View.GONE);

        if (view instanceof FrameLayout) {
            if (((FrameLayout)view).getFocusedChild() instanceof VideoView) {
                mVideoView = (VideoView)((FrameLayout)view).getFocusedChild();
            }
        }

        view.setLayoutParams(new FrameLayout.LayoutParams(FrameLayout.LayoutParams.MATCH_PARENT, FrameLayout.LayoutParams.MATCH_PARENT));
        view.setBackgroundColor(Color.BLACK);
        activity.displayFullscreenView(view);
    }

    @Override
    public boolean onConsoleMessage(ConsoleMessage cm) {
        log.warn("Console Message: " + cm.message() + " on line " + cm.lineNumber() + " of " + cm.sourceId());
        return super.onConsoleMessage(cm);
    }

    @Override
    public void onProgressChanged(WebView view, int newProgress) {
        super.onProgressChanged(view, newProgress);

        if (newProgress < 100) {
            if (loadingProgress.getVisibility() == ProgressBar.GONE) {
                loadingProgress.setVisibility(ProgressBar.VISIBLE);
            }
            loadingProgress.setProgress(newProgress);
        } else if (newProgress >= 100) {
            loadingProgress.setVisibility(ProgressBar.GONE);
        }
    }

    @Override
    public View getVideoLoadingProgressView() {
        if (mVideoProgressView == null) {
            LayoutInflater inflater = LayoutInflater.from(KnowledgeBaseFragment.this.getActivity().getApplicationContext());
            mVideoProgressView = inflater.inflate(R.layout.video_loading_progress, null);
        }

        return mVideoProgressView; 
    }

    @Override
    public boolean onError(MediaPlayer mp, int what, int extra) {
        // TODO Auto-generated method stub
        return false;
    }

    @Override
    public void onCompletion(MediaPlayer mp) {
        this.onHideCustomView();
    }
}

请注意，我正在片段内执行此操作，因此为了使其真正全屏，我不得不与活动紧密耦合，以便它可以将FrameLayout附加到整个视图层次结构的根部，而不仅仅是片段的根部。

以下是这些函数：

@Override
public void displayFullscreenView(View customView) {
    parentLayout.addView(customView);
    this.customView = customView;
}

@Override
public void removeFullscreenView() {
    if (customView != null) {
        customView.setVisibility(View.GONE);
        parentLayout.removeView(customView);
    }

    customView = null;
}

这里有一个类似于你的问题：WebView 和 HTML5 <video>

- MattC

---

我几个月没看这份代码了。很多半成品和剩下的变量。>< 是时候清理一下了。 - MattC