YouTube Video not playing in WebView

Seems like duplicate of play youtube video in WebView and YouTube Video not playing in WebView – Android

To make it work via WebView, I used the following two steps (version 4.2.2/Nexus 4):

  1. On shouldOverrideUrlLoading I added webview.setWebChromeClient(new WebChromeClient());

  2. In AndroidManifest.xml for activity tag I added android:hardwareAccelerated="true"

AndroidManifest.xml should also contain Internet permission.

While exact steps with playing video via WebView can be specific to device and Android version, there are also other alternatives to WebView, like VideoView or using Youtube Android Player API.

EDIT1

As for pause and full screen, this is actually a second link I mentioned in the beginning. To make it easier, I am posting code that worked on my Nexus.

  1. In activity_main.xml

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:paddingBottom="@dimen/activity_vertical_margin"
        android:paddingLeft="@dimen/activity_horizontal_margin"
        android:paddingRight="@dimen/activity_horizontal_margin"
        android:paddingTop="@dimen/activity_vertical_margin"
     tools:context=".MainActivity" >
    
    <FrameLayout
              android:id="@+id/fullscreen_custom_content"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:background="#FF000000"/>
    
    <LinearLayout 
              android:id="@+id/linearlayout"
              android:layout_width="fill_parent" 
              android:layout_height="fill_parent"> 
    
         <WebView
               android:id="@+id/webView"
               android:layout_width="fill_parent"
               android:layout_height="fill_parent" />
    
    </LinearLayout>
    </RelativeLayout>
    
  2. In MainActivity class:

    public class MainActivity extends Activity {
    
    private WebView mWebView;  
    private LinearLayout mContentView;
    private FrameLayout mCustomViewContainer;
    private WebChromeClient.CustomViewCallback mCustomViewCallback;
    FrameLayout.LayoutParams COVER_SCREEN_GRAVITY_CENTER = new FrameLayout.LayoutParams(
            ViewGroup.LayoutParams.WRAP_CONTENT,
            ViewGroup.LayoutParams.WRAP_CONTENT, Gravity.CENTER);
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    
        mContentView = (LinearLayout) findViewById(R.id.linearlayout);
        mWebView = (WebView) findViewById(R.id.webView);
        mCustomViewContainer = (FrameLayout) findViewById(R.id.fullscreen_custom_content);
    
        WebSettings webSettings = mWebView.getSettings();
        webSettings.setPluginState(WebSettings.PluginState.ON);
        webSettings.setJavaScriptEnabled(true);
        webSettings.setUseWideViewPort(true);
        webSettings.setLoadWithOverviewMode(true);
    
        mWebView.loadUrl("http://www.google.com");
        mWebView.setWebViewClient(new HelloWebViewClient());
    
    }
    
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }
    
    
    
    private class HelloWebViewClient extends WebViewClient  {
        @Override
        public boolean shouldOverrideUrlLoading(WebView webview, String url)
        {
            webview.setWebChromeClient(new WebChromeClient() {
    
                private View mCustomView;
    
                 @Override
                public void onShowCustomView(View view, WebChromeClient.CustomViewCallback callback)
                {
                    // if a view already exists then immediately terminate the new one
                    if (mCustomView != null)
                    {
                        callback.onCustomViewHidden();
                        return;
                    }
    
                    // Add the custom view to its container.
                    mCustomViewContainer.addView(view, COVER_SCREEN_GRAVITY_CENTER);
                    mCustomView = view;
                    mCustomViewCallback = callback;
    
                    // hide main browser view
                    mContentView.setVisibility(View.GONE);
    
                    // Finally show the custom view container.
                    mCustomViewContainer.setVisibility(View.VISIBLE);
                    mCustomViewContainer.bringToFront();
                }
    
            }); 
    
          webview.loadUrl(url);
    
          return true;
        }
    }
    
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event)
    {
        if ((keyCode == KeyEvent.KEYCODE_BACK) && mWebView.canGoBack())
        {
            mWebView.goBack();
            return true;
        }
        return super.onKeyDown(keyCode, event);
    
    } 
    }
    

EDIT2 – adding back button support

public class MainActivity extends Activity {

private WebView mWebView;  
private LinearLayout mContentView;
private FrameLayout mCustomViewContainer;
private View mCustomView;
private WebChromeClient.CustomViewCallback mCustomViewCallback;
FrameLayout.LayoutParams COVER_SCREEN_GRAVITY_CENTER = new FrameLayout.LayoutParams(
        ViewGroup.LayoutParams.WRAP_CONTENT,
        ViewGroup.LayoutParams.WRAP_CONTENT, Gravity.CENTER);

private WebChromeClient mWebChromeClient;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    mContentView = (LinearLayout) findViewById(R.id.linearlayout);
    mWebView = (WebView) findViewById(R.id.webView);
    mCustomViewContainer = (FrameLayout) findViewById(R.id.fullscreen_custom_content);

    mWebChromeClient = new WebChromeClient() {


         @Override
        public void onShowCustomView(View view, WebChromeClient.CustomViewCallback callback)
        {
            // if a view already exists then immediately terminate the new one
            if (mCustomView != null)
            {
                callback.onCustomViewHidden();
                return;
            }

            // Add the custom view to its container.
            mCustomViewContainer.addView(view, COVER_SCREEN_GRAVITY_CENTER);
            mCustomView = view;
            mCustomViewCallback = callback;

            // hide main browser view
            mContentView.setVisibility(View.GONE);

            // Finally show the custom view container.
            mCustomViewContainer.setVisibility(View.VISIBLE);
            mCustomViewContainer.bringToFront();
        }

         @Override
         public void onHideCustomView()
         {
             if (mCustomView == null)
                 return;

             // 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);
         } 
    };

    WebSettings webSettings = mWebView.getSettings();
    webSettings.setPluginState(WebSettings.PluginState.ON);
    webSettings.setJavaScriptEnabled(true);
    webSettings.setUseWideViewPort(true);
    webSettings.setLoadWithOverviewMode(true);

    mWebView.loadUrl("http://www.google.com");
    mWebView.setWebViewClient(new HelloWebViewClient());

}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.main, menu);
    return true;
}



private class HelloWebViewClient extends WebViewClient  {

    @Override
    public boolean shouldOverrideUrlLoading(WebView webview, String url)
    {
        webview.setWebChromeClient(mWebChromeClient);   
        webview.loadUrl(url);

      return true;
    }
}

@Override
protected void onStop() {

    super.onStop();
    if (mCustomView != null)
    {
        if (mCustomViewCallback != null)
            mCustomViewCallback.onCustomViewHidden();
        mCustomView = null;
    }

}

@Override
public void onBackPressed() {

    super.onBackPressed();
     if (mCustomView != null)
     {
         mWebChromeClient.onHideCustomView();
     } else
     {
         finish();
     }
}

@Override
public boolean onKeyDown(int keyCode, KeyEvent event)
{
    if ((keyCode == KeyEvent.KEYCODE_BACK) && mWebView.canGoBack())
    {
        mWebView.goBack();
        return true;
    }
    return super.onKeyDown(keyCode, event);

}   
}

Leave a Comment