带有嵌入式YouTube视频的Android WebView，全屏按钮冻结视频

Question

我有一个加载wordpress博客的android webview。一些博客文章包含youtube视频，我希望用户能够按照他们的意愿制作全屏。问题在于HTML5全屏按钮在点击时不会执行任何操作，但会冻结视图。 任何想法？

Answer 1

这是我花了最后一天左右的时间把我的头发撕掉了。基于来自网络的各种代码，我设法使其工作。

首先，您需要创建一个自定义WebChromeClient类，该类实现了onShowCustomView和onHideCustomView方法。

private class MyWebChromeClient extends WebChromeClient { 
    FrameLayout.LayoutParams LayoutParameters = new FrameLayout.LayoutParams(FrameLayout.LayoutParams.MATCH_PARENT, 
      FrameLayout.LayoutParams.MATCH_PARENT); 

    @Override 
    public void onShowCustomView(View view, CustomViewCallback callback) { 
     // if a view already exists then immediately terminate the new one 
     if (mCustomView != null) { 
      callback.onCustomViewHidden(); 
      return; 
     } 
     mContentView = (RelativeLayout) findViewById(R.id.activity_main); 
     mContentView.setVisibility(View.GONE); 
     mCustomViewContainer = new FrameLayout(MainActivity.this); 
     mCustomViewContainer.setLayoutParams(LayoutParameters); 
     mCustomViewContainer.setBackgroundResource(android.R.color.black); 
     view.setLayoutParams(LayoutParameters); 
     mCustomViewContainer.addView(view); 
     mCustomView = view; 
     mCustomViewCallback = callback; 
     mCustomViewContainer.setVisibility(View.VISIBLE); 
     setContentView(mCustomViewContainer); 
    } 

    @Override 
    public void onHideCustomView() { 
     if (mCustomView == null) { 
      return; 
     } else { 
      // Hide the custom view. 
      mCustomView.setVisibility(View.GONE); 
      // Remove the custom view from its container. 
      mCustomViewContainer.removeView(mCustomView); 
      mCustomView = null; 
      mCustomViewContainer.setVisibility(View.GONE); 
      mCustomViewCallback.onCustomViewHidden(); 
      // Show the content view. 
      mContentView.setVisibility(View.VISIBLE); 
      setContentView(mContentView); 
     } 
    } 
} 

基本上，当全屏按钮按下得到，我们正在创造一个新的视图来保存视频和隐藏主视图这里发生了什么是。然后当全屏关闭时，我们会做相反的事情 - 摆脱新视图并显示原始视图。

你也需要所有这些属性添加到您的活动类：

private MyWebChromeClient mWebChromeClient = null; 
private View mCustomView; 
private RelativeLayout mContentView; 
private FrameLayout mCustomViewContainer; 
private WebChromeClient.CustomViewCallback mCustomViewCallback; 

而且你可能希望把它关闭全屏视频时按下后退按钮：

@Override 
public void onBackPressed() { 
    if (mCustomViewContainer != null) 
     mWebChromeClient.onHideCustomView(); 
    else if (myWebView.canGoBack()) 
     myWebView.goBack(); 
    else 
     super.onBackPressed(); 
} 

然后，只需要在创建webview时使用新类：

myWebView = (WebView) findViewById(R.id.webView1); 
mWebChromeClient = new WMWebChromeClient(); 
myWebView.setWebChromeClient(mWebChromeClient); 

这适用于Android 4.x上的我。由于我的应用没有针对他们，因此不确定早期版本。

我发现这些链接特别有用：WebView and HTML5 <video>和http://code.google.com/p/html5webview/source/browse/trunk/HTML5WebView/src/org/itri/html5webview/HTML5WebView.java

Answer 2

可以启动外部YouTube应用时，你会CATH视频信息URLif并不重要，直接在应用中显示YouTube视频。

为了赶上视频信息的网址你需要owerride onLoadResource方法：

new WebViewClient() { 

    @Override 
    public void onLoadResource(WebView view, String url) { 

     if (url.startsWith("http://www.youtube.com/get_video_info?")) { 
      try { 
       String path = url.replace("http://www.youtube.com/get_video_info?", ""); 

       String[] parqamValuePairs = path.split("&"); 

       String videoId = null; 

       for (String pair : parqamValuePairs) { 
        if (pair.startsWith("video_id")) { 
         videoId = pair.split("=")[1]; 
         break; 
        } 
       } 

       if(videoId != null){ 
        startActivity(new Intent(Intent.ACTION_VIEW, Uri.parse("http://www.youtube.com")) 
          .setData(Uri.parse("http://www.youtube.com/watch?v=" + videoId))); 
        needRefresh = true; 

        return; 
       } 
      } catch (Exception ex) { 
      } 
     } else { 
      super.onLoadResource(view, url); 
     } 
    } 
}