Android WebView video playback (including full screen playback) and androidwebview

Android WebView video playback (including full screen playback) and androidwebview

Recently, the WebView video playback function has been used in the project development and summarized the mistakes that have been made during development. These errors are common during development, so I will summarize them here, I hope that you will not make similar mistakes again after seeing them and try to improve the development efficiency as much as possible:

This Demo I have also referred to a good Demo written on the Internet, which was written after summary and modification.

The following code is used:

MainActivity:

Package com. androidwebviewdemo; import android. app. activity; import android. app. progressDialog; import android. content. pm. activityInfo; import android. OS. bundle; import android. util. log; import android. view. keyEvent; import android. view. layoutInflater; import android. view. view; import android. view. window; import android. view. windowManager; import android. webkit. webChromeClient; import android. webkit. webChromeC Lient. customViewCallback; import android. webkit. webSettings; import android. webkit. webView; import android. webkit. webViewClient; import android. widget. frameLayout;/*** note when using WebView to play a video: * 1. Add the network access permission (and other required permissions ); * 2. The shouldOverrideUrlLoading method in WebViewClient can be used to click the link on the webView page. * 3. WebView must be added to play a video in webView. setWebChromeClient (new WebChromeClient (); * 4. When the video is portrait, click full screen. to switch to full screen, you must go to Manifest. xml configuration file the Ac Add the android: configChanges = "orientation | screenSize" Statement to the * configuration file of tietong. * 5. If the video cannot be played or compared, you can use hardware acceleration to add * android: hardwareAccelerated = "true. * @ Author zhongyao */public class MainActivity extends Activity {private WebView webView; private FrameLayout preview; // viewprivate View xCustomView; private ProgressDialog waitdialog = null; private CustomViewCallback callback; private myWebChromeClient xwebchromeclient; @ Overrideprotected void onCreate (Bundle savedInstanceState) {super. onCreate (savedInstanceState); requestWin DowFeature (Window. FEATURE_NO_TITLE); // remove the application title getWindow (). setFlags (WindowManager. layoutParams. FLAG_FULLSCREEN, WindowManager. layoutParams. FLAG_FULLSCREEN); setContentView (R. layout. activity_main); waitdialog = new ProgressDialog (this); waitdialog. setTitle ("prompt"); waitdialog. setMessage ("loading video pages... "); waitdialog. setIndeterminate (true); waitdialog. setCancelable (true); waitdialog. show (); webView = (WebView) findV IewById (R. id. webView); video_fullView = (FrameLayout) findViewById (R. id. video_fullView); WebSettings ws = webView. getSettings (); ws. setBuiltInZoomControls (true); // hide the zoom button // ws. setLayoutAlgorithm (WebSettings. layoutAlgorithm. NORMAL); // apply the layout to the screen ws. setUseWideViewPort (true); // You can scale the ws in any proportion. setLoadWithOverviewMode (true); // The setUseWideViewPort method sets the window recommended for webview. The setLoadWithOverviewMode method is used to set the page loading mode of webview. Ws. setSavePassword (true); ws. setSaveFormData (true); // Save the form data ws. setJavaScriptEnabled (true); ws. setGeolocationEnabled (true); // enable ws for geographic positioning. setGeolocationDatabasePath ("/data/org.itri.html 5 webview/databases/"); // you can specify the database path ws. setDomStorageEnabled (true); ws. setSupportMultipleWindows (true); // Add xwebchromeclient = new myWebChromeClient (); webView. setWebChromeClient (xwebchromeclient); webView. setWebViewClient (New myWebViewClient (); webView. loadUrl ("http://look.appjx.cn/mobile_api.php? Mod = news & id = 12604 ");} public class myWebViewClient extends WebViewClient {@ Overridepublic boolean shouldOverrideUrlLoading (WebView, String url) {view. loadUrl (url); return false ;}@ Overridepublic void onPageFinished (WebView view, String url) {super. onPageFinished (view, url); waitdialog. dismiss () ;}} public class myWebChromeClient extends WebChromeClient {private View xprogressvideo; // The caller who calls the full screen when playing a network video Method @ Overridepublic void onShowCustomView (View view, CustomViewCallback callback) {setRequestedOrientation (ActivityInfo. SCREEN_ORIENTATION_LANDSCAPE); webView. setVisibility (View. INVISIBLE); // if a view already exists, terminate and create an if (xCustomView! = Null) {callback. onCustomViewHidden (); return;} video_fullView.addView (view); xCustomView = view; xCustomViewCallback = callback; video_fullView.setVisibility (View. VISIBLE);} // The @ Overridepublic void onHideCustomView () {if (xCustomView = null) that will be called to exit full screen playback. // return is not in full screen playback status; setRequestedOrientation (ActivityInfo. SCREEN_ORIENTATION_PORTRAIT); xCustomView. setVisibility (View. GONE); video_fullView.removeView (xCu StomView); xCustomView = null; video_fullView.setVisibility (View. GONE); xCustomViewCallback. onCustomViewHidden (); webView. setVisibility (View. VISIBLE);} // process loading @ Overridepublic View getVideoLoadingProgressView () {if (xprogressvideo = null) {LayoutInflater inflater = LayoutInflater. from (MainActivity. this); xprogressvideo = inflater. inflate (R. layout. video_loading_progress, null);} return xprogress Video;}/*** determine whether the screen is full ** @ return */public boolean inCustomView () {return (xCustomView! = Null);}/*** press the add-back key to exit full screen mode */public void hideCustomView () {xwebchromeclient. onHideCustomView (); setRequestedOrientation (ActivityInfo. SCREEN_ORIENTATION_PORTRAIT);} @ Overrideprotected void onResume () {super. onResume (); super. onResume (); webView. onResume (); webView. resumeTimers ();/*** set to landscape screen */if (getRequestedOrientation ()! = ActivityInfo. SCREEN_ORIENTATION_LANDSCAPE) {setRequestedOrientation (ActivityInfo. SCREEN_ORIENTATION_PORTRAIT) ;}@overrideprotected void onPause () {super. onPause (); webView. onPause (); webView. pauseTimers () ;}@ Overrideprotected void onDestroy () {super. onDestroy (); super. onDestroy (); video_fullView.removeAllViews (); webView. loadUrl ("about: blank"); webView. stopLoading (); webView. setWebChromeClient (null); webView. setWebViewClient (null); webView. destroy (); webView = null ;}@ Overridepublic boolean onKeyDown (int keyCode, KeyEvent event) {if (keyCode = KeyEvent. KEYCODE_BACK) {if (inCustomView () {// webViewDetails. loadUrl ("about: blank"); hideCustomView (); return true;} else {webView. loadUrl ("about: blank"); MainActivity. this. finish () ;}} return false ;}}

Activity_main.xml:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:orientation="vertical" >    <FrameLayout        android:id="@+id/video_fullView"        android:layout_width="fill_parent"        android:layout_height="fill_parent"        android:visibility="gone" >    </FrameLayout>    <WebView        android:id="@+id/webView"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_marginTop="20sp" /></LinearLayout>

Video_loading_progress.xml:

<? Xml version = "1.0" encoding = "UTF-8"?> <LinearLayout xmlns: android = "http://schemas.android.com/apk/res/android" android: id = "@ + id/progress_indicator" android: layout_width = "wrap_content" android: layout_height = "wrap_content" android: layout_centerInParent = "true" android: orientation = "vertical"> <ProgressBar android: id = "@ android: id/progress" style = "? Android: attr/progressBarStyleLarge "android: layout_width =" wrap_content "android: layout_height =" wrap_content "android: layout_gravity =" center "/> <TextView android: layout_width =" wrap_content "android: layout_height = "wrap_content" android: layout_gravity = "center" android: paddingTop = "5dip" android: text = "is loading videos... "Android: textColor = "? Android: attr/textColorPrimary "android: textSize =" 14sp "/> </LinearLayout>

AndroidManifest. xml:

<? Xml version = "1.0" encoding = "UTF-8"?> <Manifest xmlns: android = "http://schemas.android.com/apk/res/android" package = "com. androidwebviewdemo "android: versionCode =" 1 "android: versionName =" 1.0 "> <uses-sdk android: minSdkVersion =" 8 "android: targetSdkVersion = "17"/> <uses-permission android: name = "android. permission. INTERNET "/> <uses-permission android: name =" android. permission. ACCESS_COARSE_LOCATION "/> <uses-permission android: name =" android. Permission. ACCESS_FINE_LOCATION "/> <uses-permission android: name =" android. permission. ACCESS_MOCK_LOCATION "/> <uses-permission android: name =" android. permission. ACCESS_GPS "/> <uses-permission android: name =" android. permission. access_received_gps "/> <uses-permission android: name =" android. permission. ACCESS_LOCATION "/> <uses-permission android: name =" android. permission. READ_PHONE_STATE "/> <applicati On android: allowBackup = "true" android: hardwareAccelerated = "true" android: icon = "@ drawable/ic_launcher" android: label = "@ string/app_name" android: theme = "@ style/AppTheme"> <! -- Android: configChanges = "orientation | keyboardHidden" --> <! -- By default, the portrait screen is displayed. If you click full screen and then the landscape screen is displayed, you must configure android: configChanges = "orientation | screenSize" for the activity. In this way, you can only call onConfigurationChanged to rotate the screen, no new activity is created. Otherwise, a new Activity will be created when the horizontal screen is set in the Code, so that the screen will be full screen when you click it. --> <Activity android: name = "com. androidwebviewdemo. mainActivity "android: configChanges =" orientation | screenSize "android: label =" @ string/app_name "> <intent-filter> <action android: name =" android. intent. action. MAIN "/> <category android: name =" android. intent. category. LAUNCHER "/> </intent-filter> </activity> </application> </manifest>

The source code can be downloaded from my uploaded resources.

How does android use webview to control playback buttons for online videos?

Add in the code
Webview. getSettings (). setJavaScriptEnabled (true); // supports js
Webview. getSettings (). setPluginsEnabled (true); // sets the webview support plug-in.

In addition, android: hardwareAccelerated = "true" Hardware acceleration must be added to the application of the Manifest configuration file to enable video playback.

How to play online videos in Android webview

1. Create an html file and edit its content:
<Html> 3. There are many devices that only have sound and no screen. In this case, add the application in androidmanifest. xml to set hardware rendering to true, and enable hardware rendering in the Oncreate function. This is a bit vague.