How to make Video full screen in a webview with example

In this tutorial,we will learn that how can display video full screen in webview with easy explanation

So Let’s start

1. We have to implement two methods “showCustomView” & “hideCustomView” of WebChromeClient class.

2.We need to declare “android:hardwareAccelerated” in your manifest file

 Move to the Xml file

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:app="http://schemas.android.com/apk/res-auto"
   xmlns:tools="http://schemas.android.com/tools"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   tools:context=".MainActivity">

   <FrameLayout
       android:id="@+id/framelayout"
       android:layout_width="match_parent"
       android:layout_height="match_parent"/>

   <WebView
       android:id="@+id/webView1"
       android:layout_width="match_parent"
       android:layout_height="match_parent"/>

</RelativeLayout>

Move to the activity

MainActivity.java


public class MainActivity extends AppCompatActivity {
   private WebView webView;
   private FrameLayout framelayout;
   final Activity activity = this;

   @SuppressLint("SetJavaScriptEnabled")
   @Override
   protected void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);
       setContentView(R.layout.activity_main);
          
       webView = (WebView) findViewById(R.id.webView1);
       framelayout=findViewById(R.id.framelayout);
       webView.getSettings().setJavaScriptEnabled(true);

      String url="https://www.youtube.com/";
      webView.loadUrl(url);
       webView.setWebViewClient(new WebViewClient());
       webView.getSettings().setJavaScriptEnabled(true);
       webView.setWebChromeClient(new WebChromeClient());
       webView.getSettings().setUserAgentString("Mozilla/5.0 (Linux; Win64; x64; rv:46.0) Gecko/20100101 Firefox/68.0");
       webView.getSettings().setGeolocationEnabled(true);
       webView.getSettings().setDomStorageEnabled(true);
       webView.getSettings().setDatabaseEnabled(true);
       webView.getSettings().setSupportMultipleWindows(true);

       webView.getSettings().setBuiltInZoomControls(true);
       webView.getSettings().setSupportZoom(true);
       webView.setInitialScale(0);


       final Activity activity = this;

       webView.setWebChromeClient(new WebChromeClient() {

           public void onProgressChanged(WebView view, int progress) {
               activity.setProgress(progress * 1000);
           }
       });


       if (ContextCompat.checkSelfPermission(MainActivity.this, Manifest.permission.CAMERA)
               != PackageManager.PERMISSION_GRANTED) {
           ActivityCompat.requestPermissions(this, new String[] {android.Manifest.permission.CAMERA}, 50);
       }
       webView.setWebChromeClient(new WebChromeClient() {

           @TargetApi(Build.VERSION_CODES.LOLLIPOP)
           @Override
           public void onPermissionRequest(final PermissionRequest request) {
               request.grant(request.getResources());
           }

           public void onShowCustomView(View view, WebChromeClient.CustomViewCallback callback) {
               super.onShowCustomView(view,callback);
               webView.setVisibility(View.GONE);
               framelayout.setVisibility(View.VISIBLE);
               framelayout.addView(view);
           }
           public void onHideCustomView () {
               super.onHideCustomView();
               webView.setVisibility(View.VISIBLE);
               framelayout.setVisibility(View.GONE);
           }
       });

   }
}

Move to the AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
   package="com.e.webviewproject">

   <uses-permission android:name="android.permission.INTERNET" />
   <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
   <uses-permission android:name="android.permission.READ_PHONE_STATE" />
   <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
   <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
   <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW" />
   <uses-permission android:name="android.permission.RECORD_AUDIO" />
   <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
   <uses-permission android:name="android.permission.CAMERA" />
   <uses-feature
       android:name="android.hardware.camera"
       android:required="false" />
   <uses-feature android:name="android.hardware.camera.autofocus" />

   <application
       android:allowBackup="true"
       android:icon="@mipmap/ic_launcher"
       android:label="@string/app_name"
       android:roundIcon="@mipmap/ic_launcher_round"
       android:usesCleartextTraffic="true"
       android:supportsRtl="true"
       android:hardwareAccelerated="true"
       android:theme="@style/AppTheme">
       <activity android:name=".MainActivity">
           <intent-filter>
               <action android:name="android.intent.action.MAIN" />

               <category android:name="android.intent.category.LAUNCHER" />
           </intent-filter>
       </activity>
   </application>

</manifest>

Now when you run the above code then you will see a list of  youtube videos & make a video full screen then it will work fine.

Best of Luck!!!

sumankumar80

Hello Friends,I have written and developed this website because you can learn technology easily ,prepare for the placement and also for the any type of examination . By :Suman Kumar

Leave a Reply

Your email address will not be published. Required fields are marked *