SoFunction
Updated on 2025-04-10

Android WebView realizes full-screen video playback

introduce

Recently, the WebView video playback function was used in project development, and summarized the mistakes made in development. These mistakes are easy to encounter in development. So I have summarized them here. I hope that everyone will not make similar mistakes again after seeing them, and improve development efficiency as much as possible:

I also refer to a relatively good demo written on the Internet. After summary and modification, I wrote it out.

Main code

The following is the corresponding code:

MainActivity:

package ;
 
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
import ;
 
/**
  * Things to note when playing videos using WebView:
  * 1. Add network access permissions (and other required permissions);
  * 2. The method shouldOverrideUrlLoading in WebViewClient can be used to implement links to click on webView pages;
  * 3. Video playback in WebView needs to be added (new WebChromeClient());
  * 4. When the video is vertical, click on full screen. If you want to switch to the horizontal full screen state, you must be in the configuration file.
  * Add android:configChanges="orientation|screenSize" statement to the configuration file.
  * 5. If the video cannot be played, or the playback comparison card can be used, hardware acceleration can be used, that is, it can be added in the configuration file of the Application or Activity.
  * android:hardwareAccelerated="true".
  * @author zhongyao
  */
public class MainActivity extends Activity {
	private WebView webView;
	private FrameLayout video_fullView;// Video loading view when full screen	private View xCustomView;
	private ProgressDialog waitdialog = null;
	private CustomViewCallback xCustomViewCallback;
	private myWebChromeClient xwebchromeclient;
 
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		(savedInstanceState);
		requestWindowFeature(Window.FEATURE_NO_TITLE);// Remove the application title		getWindow().setFlags(.FLAG_FULLSCREEN,
				.FLAG_FULLSCREEN);
		setContentView(.activity_main);
		
		waitdialog = new ProgressDialog(this);
		("hint");
		("Video page loading...");
		(true);
		(true);
		();
 
		webView = (WebView) findViewById();
		video_fullView = (FrameLayout) findViewById(.video_fullView);
 
		WebSettings ws = ();
		(true);// Hide the zoom button		// ();// Typesetting adapts to the screen 
		(true);// Can be scaled at any rate		(true);// setUseWideViewPort method sets the recommended window for webview.  The setLoadWithOverviewMode method is to set the mode of the page loaded by the webview. 
		(true);
		(true);// Save form data		(true);
		(true);// Enable geolocation		("/data/data/.html5webview/databases/");// Set the database path to locate		(true);
		(true);// Add		xwebchromeclient = new myWebChromeClient();
		(xwebchromeclient);
		(new myWebViewClient());
		("/mobile_api.php?mod=news&id=12604");
	}
 
	public class myWebViewClient extends WebViewClient {
		@Override
		public boolean shouldOverrideUrlLoading(WebView view, String url) {
			(url);
			return false;
		}
 
		@Override
		public void onPageFinished(WebView view, String url) {
			(view, url);
			();
		}
	}
 
	public class myWebChromeClient extends WebChromeClient {
		private View xprogressvideo;
 
		// Methods that will be called on the full screen when playing network video		@Override
		public void onShowCustomView(View view, CustomViewCallback callback) {
			setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);
			();
			// If a view already exists, terminate immediately and create a new one			if (xCustomView != null) {
				();
				return;
			}
			video_fullView.addView(view);
			xCustomView = view;
			xCustomViewCallback = callback;
			video_fullView.setVisibility();
		}
 
		// If the video playback exits the full screen, it will be called		@Override
		public void onHideCustomView() {
			if (xCustomView == null)// Not full screen playback status				return;
 
			setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
			();
			video_fullView.removeView(xCustomView);
			xCustomView = null;
			video_fullView.setVisibility();
			();
			();
		}
 
		// Process loading when video is loading		@Override
		public View getVideoLoadingProgressView() {
			if (xprogressvideo == null) {
				LayoutInflater inflater = LayoutInflater
						.from();
				xprogressvideo = (
						.video_loading_progress, null);
			}
			return xprogressvideo;
		}
	}
 
	/**
	  * Determine whether it is full screen
	  *
	  * @return
	  */
	public boolean inCustomView() {
		return (xCustomView != null);
	}
 
	/**
	  * Press the return key to execute the method of exiting the full screen
	  */
	public void hideCustomView() {
		();
		setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
	}
 
	@Override
	protected void onResume() {
		();
		();
		();
		();
 
		/**
		  * Set to horizontal screen
		  */
		if (getRequestedOrientation() != ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE) {
			setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
		}
	}
 
	@Override
	protected void onPause() {
		();
		();
		();
	}
 
	@Override
	protected void onDestroy() {
		();
		();
		video_fullView.removeAllViews();
		("about:blank");
		();
		(null);
		(null);
		();
		webView = null;
	}
	@Override
	public boolean onKeyDown(int keyCode, KeyEvent event) {
		if (keyCode == KeyEvent.KEYCODE_BACK) {
			if (inCustomView()) {
				// ("about:blank");
				hideCustomView();
				return true;
			} else {
				("about:blank");
				();
			}
		}
		return false;
	}
}

activity_main.xml:

<LinearLayout xmlns:andro
    xmlns:tools="/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >
 
    <FrameLayout
        android:
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:visibility="gone" >
    </FrameLayout>
 
    <WebView
        android:
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="20sp" />
 
</LinearLayout>

video_loading_progress.xml:

&lt;?xml version="1.0" encoding="utf-8"?&gt;
&lt;LinearLayout xmlns:andro
    android:
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerInParent="true"
    android:orientation="vertical" &gt;
 
    &lt;ProgressBar
        android:
        style="?android:attr/progressBarStyleLarge"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" /&gt;
 
    &lt;TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:paddingTop="5dip"
        android:text="I'm dying to load the video...."
        android:textColor="?android:attr/textColorPrimary"
        android:textSize="14sp" /&gt;
 
&lt;/LinearLayout&gt;

&lt;?xml version="1.0" encoding="utf-8"?&gt;
&lt;manifest xmlns:andro
    package=""
    android:versionCode="1"
    android:versionName="1.0" &gt;
 
    &lt;uses-sdk
        android:minSdkVersion="8"
        android:targetSdkVersion="17" /&gt;
 
    &lt;uses-permission android:name="" /&gt;
    &lt;uses-permission android:name=".ACCESS_COARSE_LOCATION" /&gt;
    &lt;uses-permission android:name=".ACCESS_FINE_LOCATION" /&gt;
    &lt;uses-permission android:name=".ACCESS_MOCK_LOCATION" /&gt;
    &lt;uses-permission android:name=".ACCESS_GPS" /&gt;
    &lt;uses-permission android:name=".ACCESS_ASSISTED_GPS" /&gt;
    &lt;uses-permission android:name=".ACCESS_LOCATION" /&gt;
	&lt;uses-permission android:name=".READ_PHONE_STATE"/&gt;
    &lt;application
        android:allowBackup="true"
        android:hardwareAccelerated="true"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" &gt;
 
        &lt;!-- android:configChanges="orientation|keyboardHidden" --&gt;
        &lt;!-- Default vertical screen,Click on the full screen and then horizontally,
         	SoactivityMust be configuredandroid:configChanges="orientation|screenSize"
			This way,Rotate the screen,Will only callonConfigurationChanged,No new creationactivity。
			otherwise,When setting horizontal screen in the code,A new one will be createdActivity,
			That way, there is no way to click on it and full screen。 --&gt;
        &lt;activity
            android:name=""
            android:configChanges="orientation|screenSize"
            android:label="@string/app_name" &gt;
            &lt;intent-filter&gt;
                &lt;action android:name="" /&gt;
 
                &lt;category android:name="" /&gt;
            &lt;/intent-filter&gt;
        &lt;/activity&gt;
    &lt;/application&gt;
 
&lt;/manifest&gt;

The above is the detailed content of Android WebView's full-screen video playback. For more information about Android WebView's video playback, please follow my other related articles!