程序员人生 网站导航

Android WebView播放视频(包括全屏播放)

栏目:综合技术时间:2014-10-02 08:00:01

最近项目开发中用到了WebView播放视频的功能,总结了开发中犯过的错误,这些错误在开发是及容易遇到的,所以我这里总结了一下,希望大家看到后不要再犯类似的错误,尽可能提高开发效率:

这个Demo我这里也参考了网上写的一个比较好的一个Demo,经过总结修改,写出来的。

以下是相应代码:

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.WebChromeClient.CustomViewCallback; import android.webkit.WebSettings; import android.webkit.WebView; import android.webkit.WebViewClient; import android.widget.FrameLayout; /** * 使用WebView播放视频时需要注意的地方: * 1、加网络访问权限(及其他所需要的权限); * 2、WebViewClient中方法shouldOverrideUrlLoading可用来实现点击webView页面的链接; * 3、WebView中播放视频需要添加webView.setWebChromeClient(new WebChromeClient()); * 4、视频竖屏时,点击全屏,想要切换到横屏全屏的状态,那么必须在Manifest.xml配置文件该Activity的 * 配置文件中添加android:configChanges="orientation|screenSize"语句。 * 5、如果视频不能播放,或者播放比较卡,可以采用硬件加速,即在Application,或所在的Activity的配置文件中添加 * android:hardwareAccelerated="true"即可。 * @author zhongyao */ public class MainActivity extends Activity { private WebView webView; private FrameLayout video_fullView;// 全屏时视频加载view private View xCustomView; private ProgressDialog waitdialog = null; private CustomViewCallback xCustomViewCallback; private myWebChromeClient xwebchromeclient; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); requestWindowFeature(Window.FEATURE_NO_TITLE);// 去掉应用标题 getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN); setContentView(R.layout.activity_main); waitdialog = new ProgressDialog(this); waitdialog.setTitle("提示"); waitdialog.setMessage("视频页面加载中..."); waitdialog.setIndeterminate(true); waitdialog.setCancelable(true); waitdialog.show(); webView = (WebView) findViewById(R.id.webView); video_fullView = (FrameLayout) findViewById(R.id.video_fullView); WebSettings ws = webView.getSettings(); ws.setBuiltInZoomControls(true);// 隐藏缩放按钮 // ws.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.NORMAL);// 排版适应屏幕 ws.setUseWideViewPort(true);// 可任意比例缩放 ws.setLoadWithOverviewMode(true);// setUseWideViewPort方法设置webview推荐使用的窗口。setLoadWithOverviewMode方法是设置webview加载的页面的模式。 ws.setSavePassword(true); ws.setSaveFormData(true);// 保存表单数据 ws.setJavaScriptEnabled(true); ws.setGeolocationEnabled(true);// 启用地理定位 ws.setGeolocationDatabasePath("/data/data/org.itri.html5webview/databases/");// 设置定位的数据库路径 ws.setDomStorageEnabled(true); ws.setSupportMultipleWindows(true);// 新加 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 { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); return false; } @Override public void onPageFinished(WebView view, String url) { super.onPageFinished(view, url); waitdialog.dismiss(); } } public class myWebChromeClient extends WebChromeClient { private View xprogressvideo; // 播放网络视频时全屏会被调用的方法 @Override public void onShowCustomView(View view, CustomViewCallback callback) { setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE); webView.setVisibility(View.INVISIBLE); // 如果一个视图已经存在,那么立刻终止并新建一个 if (xCustomView != null) { callback.onCustomViewHidden(); return; } video_fullView.addView(view); xCustomView = view; xCustomViewCallback = callback; video_fullView.setVisibility(View.VISIBLE); } // 视频播放退出全屏会被调用的 @Override public void onHideCustomView() { if (xCustomView == null)// 不是全屏播放状态 return; setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT); xCustomView.setVisibility(View.GONE); video_fullView.removeView(xCustomView); xCustomView = null; video_fullView.setVisibility(View.GONE); xCustomViewCallback.onCustomViewHidden(); webView.setVisibility(View.VISIBLE); } // 视频加载时进程loading @Override public View getVideoLoadingProgressView() { if (xprogressvideo == null) { LayoutInflater inflater = LayoutInflater .from(MainActivity.this); xprogressvideo = inflater.inflate( R.layout.video_loading_progress, null); } return xprogressvideo; } } /** * 判断是否是全屏 * * @return */ public boolean inCustomView() { return (xCustomView != null); } /** * 全屏时按返加键执行退出全屏方法 */ public void hideCustomView() { xwebchromeclient.onHideCustomView(); setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT); } @Override protected void onResume() { super.onResume(); super.onResume(); webView.onResume(); webView.resumeTimers(); /** * 设置为横屏 */ if (getRequestedOrientation() != ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE) { setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT); } } @Override protected void onPause() { super.onPause(); webView.onPause(); webView.pauseTimers(); } @Override protected 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; } @Override public 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="正在玩命加载视频中。。。" 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_ASSISTED_GPS" /> <uses-permission android:name="android.permission.ACCESS_LOCATION" /> <uses-permission android:name="android.permission.READ_PHONE_STATE"/> <application android:allowBackup="true" android:hardwareAccelerated="true" android:icon="@drawable/ic_launcher" android:label="@string/app_name" android:theme="@style/AppTheme" > <!-- android:configChanges="orientation|keyboardHidden" --> <!-- 默认竖屏,点击全屏后再横屏, 那么activity必须配置android:configChanges="orientation|screenSize" 这样一来,旋转屏幕,只会调用onConfigurationChanged,不会创建新activity。 不然的话,代码中设置横屏的时候,都会新建一个Activity, 那样就没办法实现点击就横屏全屏了。 --> <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>

源码可到我的上传的资源中下载。




------分隔线----------------------------
------分隔线----------------------------

最新技术推荐