MyX5TbsDemo【体验腾讯浏览服务Android SDK (完整版)】

版权声明:本文为HaiyuKing原创文章,转载请注明出处!

前言

按照官网上的说明:可独立下载x5内核,也可共享使用微信或手Q的x5内核。

本Demo在引用腾讯X5内核的基础上进行了封装。参考《MyWebViewDemo【封装Webview常用配置和选择文件、打开相机、录音、打开本地相册的用法】

使用TbsReaderView预览文件功能,请参考《MyX5TbsPlusDemo【体验腾讯浏览服务Android SDK (TbsPlus 版)】

效果图

MyX5TbsDemo【体验腾讯浏览服务Android SDK (完整版)】

代码分析

X5WebView : 对腾讯X5内核的webview进行了封装;

BrowserActivity:用于展现打开普通网页;

FilechooserActivity : 用于展示在web端<input type=text>的标签被选择之后,文件选择器的制作和生成;

FullScreenActivity : 用于演示X5webview实现视频的全屏播放功能 其中注意 X5的默认全屏方式 与 android 系统的全屏方式

注意:

X5WebView 继承 WebView(指的是X5内核的webview,所以import com.tencent.smtt.sdk.WebView;)

X5WebViewClient 继承 WebViewClient(import com.tencent.smtt.sdk.WebViewClient;)

X5WebChromeClient 继承 WebChromeClient(import com.tencent.smtt.sdk.WebChromeClient;)

使用步骤

一、项目组织结构图

MyX5TbsDemo【体验腾讯浏览服务Android SDK (完整版)】

MyX5TbsDemo【体验腾讯浏览服务Android SDK (完整版)】

MyX5TbsDemo【体验腾讯浏览服务Android SDK (完整版)】

注意事项:

1、  导入类文件后需要change包名以及重新import R文件路径

2、  Values目录下的文件(strings.xml、dimens.xml、colors.xml等),如果项目中存在,则复制里面的内容,不要整个覆盖

二、导入步骤

1、下载sdk

下载地址:https://x5.tencent.com/tbs/sdk.html

MyX5TbsDemo【体验腾讯浏览服务Android SDK (完整版)】

下载的文件解压后如下:【接入文档很有用】

MyX5TbsDemo【体验腾讯浏览服务Android SDK (完整版)】

2、将jar文件导入项目中

参考《【Android Studio安装部署系列】十七、Android studio引用第三方库、jar、so、arr文件

MyX5TbsDemo【体验腾讯浏览服务Android SDK (完整版)】

3、实现支持64位手机加载X5

将SDK接入示例-Android Studio文件中的demo项目的jniLibs目录复制到项目的main目录下【如果项目的main目录中已经存在jniLibs文件夹,则只需要把so文件复制到相应armeabi目录下】

MyX5TbsDemo【体验腾讯浏览服务Android SDK (完整版)】

在build.gradle文件中添加以下代码

apply plugin: 'com.android.application'

android {
compileSdkVersion 27
defaultConfig {
applicationId "com.why.project.myx5tbsdemo"
minSdkVersion 16
targetSdkVersion 27
versionCode 1
versionName "1.0"
testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner" //腾讯浏览服务实现支持64位手机加载X5
// Specifies the ABI configurations of your native
// libraries Gradle should build and package with your APK.
ndk {
abiFilters "armeabi", "armeabi-v7a", "x86", "mips"
}
}
buildTypes {
release {
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
}
}
} dependencies {
implementation fileTree(dir: 'libs', include: ['*.jar'])
implementation 'com.android.support:appcompat-v7:27.1.1'
implementation 'com.android.support.constraint:constraint-layout:1.1.2'
testImplementation 'junit:junit:4.12'
androidTestImplementation 'com.android.support.test:runner:1.0.2'
androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
}

如果配置后编译报错,那么需要在gradle.properties文件中加上Android.useDeprecatedNdk=true;【一般不需要,本demo中没有添加】

4、在AndroidManifest.xml中声明权限

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.why.project.myx5tbsdemo"> <!-- ======================腾讯浏览服务========================== -->
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />
<uses-permission android:name="android.permission.READ_SETTINGS" />
<uses-permission android:name="android.permission.WRITE_SETTINGS" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.MOUNT_UNMOUNT_FILESYSTEMS" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" /> <!-- 硬件加速对X5视频播放非常重要,建议开启(如果有网页视频播放的话建议开启) -->
<uses-permission android:name="android.permission.GET_TASKS" /> <application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="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>

5、在自定义Application里面初始化X5内核

package com.why.project.myx5tbsdemo;

import android.app.Application;
import android.content.Context;
import android.util.Log; import com.tencent.smtt.sdk.QbSdk; /**
* Created by HaiyuKing
* Used 在Application里面初始化X5内核
*/ public class MyApplication extends Application { /**系统上下文*/
private static Context mAppContext; @Override
public void onCreate() {
// TODO Auto-generated method stub
super.onCreate();
mAppContext = getApplicationContext(); //配置腾讯浏览服务
initQbSdk(); } /**获取系统上下文*/
public static Context getAppContext()
{
return mAppContext;
} private void initQbSdk() {
//搜集本地tbs内核信息并上报服务器,服务器返回结果决定使用哪个内核。
QbSdk.PreInitCallback cb = new QbSdk.PreInitCallback() {
@Override
public void onViewInitFinished(boolean arg0) {
// TODO Auto-generated method stub
//x5內核初始化完成的回调,为true表示x5内核加载成功,否则表示x5内核加载失败,会自动切换到系统内核。
Log.d("app", " onViewInitFinished is " + arg0);
}
@Override
public void onCoreInitFinished() {
// TODO Auto-generated method stub
}
};
//x5内核初始化接口
QbSdk.initX5Environment(mAppContext, cb);
}
}

6、在AndroidManifest.xml文件中声明这个自定义的application

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.why.project.myx5tbsdemo"> <!-- ======================腾讯浏览服务========================== -->
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />
<uses-permission android:name="android.permission.READ_SETTINGS" />
<uses-permission android:name="android.permission.WRITE_SETTINGS" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.MOUNT_UNMOUNT_FILESYSTEMS" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" /> <!-- 硬件加速对X5视频播放非常重要,建议开启(如果有网页视频播放的话建议开启) -->
<uses-permission android:name="android.permission.GET_TASKS" /> <application
android:name=".MyApplication"
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="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>

到这里,基本上将腾讯浏览服务X5内核引入到项目中了。不过本Demo对X5WebView进行了封装,所以还需要进行下面的操作。

二、下面导入自己封装的X5WebView

1、将customwebview包复制到项目中

MyX5TbsDemo【体验腾讯浏览服务Android SDK (完整版)】

2、将x5webview_progress_dialog_img_drawable.xml复制到项目中

<?xml version="1.0" encoding="utf-8"?>
<!-- WebView使用的进度加载对话框进度圆圈 -->
<animated-rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:drawable="@drawable/x5webview_progress_dialog_img"
android:pivotX="50%"
android:pivotY="50%"
android:fromDegrees="0.0"
android:toDegrees="360.0"
android:repeatMode="restart"
/>

x5webview_progress_dialog_img_drawable.xml

3、将x5webview_progress_dialog_img.png图片复制到项目中

MyX5TbsDemo【体验腾讯浏览服务Android SDK (完整版)】

MyX5TbsDemo【体验腾讯浏览服务Android SDK (完整版)】

4、将x5webview_dialog_webviewprogress.xml复制到项目中

<?xml version="1.0" encoding="utf-8"?>
<!-- WebView使用的进度加载对话框布局文件 -->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/dialog_view"
android:layout_width="match_parent"
android:layout_height="match_parent"> <!-- 自定义圆形进度条 -->
<!-- android:indeterminateDrawable自定义动画图标 -->
<ProgressBar
android:id="@+id/loadProgressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:indeterminateDrawable="@drawable/x5webview_progress_dialog_img_drawable"
/> </RelativeLayout>

x5webview_dialog_webviewprogress.xml

5、在styles.xml文件中添加以下代码

<resources>

    <!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style> <!-- ==================X5Webview========网页加载时的进度对话框========================== -->
<style name="x5webview_loading_style" parent="android:style/Theme.Dialog">
<!-- Dialog的windowFrame框为无 -->
<item name="android:windowFrame">@null</item>
<!-- 是否显示title -->
<item name="android:windowNoTitle">true</item>
<!-- 是否浮现在activity之上 -->
<item name="android:windowIsFloating">true</item>
<!-- 设置dialog的背景:#00000000透明色 -->
<item name="android:windowBackground">@android:color/transparent</item>
<!-- 半透明 -->
<item name="android:windowIsTranslucent">true</item>
<!-- 背景变灰:整个屏幕变灰,配合setCanceledOnTouchOutside(false) -->
<item name="android:backgroundDimEnabled">false</item>
<!-- 对话框是否有遮盖 -->
<item name="android:windowContentOverlay">@null</item>
</style> </resources>

6、在AndroidManifest.xml中添加以下代码【因为有重复的权限,所以注释掉了】

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.why.project.myx5tbsdemo"> <!-- ======================腾讯浏览服务========================== -->
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />
<uses-permission android:name="android.permission.READ_SETTINGS" />
<uses-permission android:name="android.permission.WRITE_SETTINGS" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.MOUNT_UNMOUNT_FILESYSTEMS" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" /> <!-- 硬件加速对X5视频播放非常重要,建议开启(如果有网页视频播放的话建议开启) -->
<uses-permission android:name="android.permission.GET_TASKS" /> <!-- ======================(X5WebView)========================== -->
<!-- 允许程序打开网络套接字 -->
<!--<uses-permission android:name="android.permission.INTERNET"/>-->
<!-- ======================拍照用到的========================== -->
<uses-permission android:name="android.permission.CAMERA" />
<!-- ======================录音用到的========================== -->
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<!-- 向SD卡写入数据权限 -->
<!--<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />-->
<!--<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />--> <application
android:name=".MyApplication"
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="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>

7、将assets文件夹复制到项目中

MyX5TbsDemo【体验腾讯浏览服务Android SDK (完整版)】

<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="content-type">
<meta http-equiv="keywords" content="测试">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>
webview
</title>
</head> <body>
<p>
<input type="file" value="打开文件" />
</p> <p>
点击下面的按钮,获取的文件路径:
</p>
<p>
<input type="text" id="filePath" value="文件路径" style="width:100%"/>
</p>
<p>
<input type="button" id="openRecord" value="打开录音" onclick="window.androidMethod.openRecord();"/>
</p>
<p>
<input type="button" id="takePicture" value="打开相机" onclick="window.androidMethod.takePicture();"/>
</p>
<p>
<input type="button" id="choosePic" value="打开本地相册" onclick="window.androidMethod.choosePic();"/>
</p>
<p>
<a href='tel:10010'>拨打电话:10010</a>
</p>
</body>
<script>
//打开录音、打开相机、打开本地相册,选择文件后返回的路径
function setInputText(urlPath){
document.getElementById("filePath").value = urlPath;
}
</script> </html>

demo.html

三、因为demo中使用到获取手机本地文件的权限和调用相机功能,所以需要申请运行时权限和适配7.0FIleProvider功能。

0-1、申请运行时权限,参考《Android6.0运行时权限(基于RxPermission开源库)

0-2、适配Android7.0FileProvider功能,参考《AppUtils【获取手机的信息和应用版本号、安装apk】

三、使用方法

1、打开普通网页,参考BrowserActivity

package com.why.project.myx5tbsdemo;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.KeyEvent;
import android.widget.FrameLayout; import com.why.project.myx5tbsdemo.customwebview.x5webview.X5WebView; /**
* Created by HaiyuKing
* Used 用于展现打开普通网页;
*/ public class BrowserActivity extends AppCompatActivity {
private static final String TAG = BrowserActivity.class.getSimpleName(); //内容显示区域
private FrameLayout center_layout;
private X5WebView mX5WebView; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_x5webview); initViews();
initDatas();
initEvents();
} @Override
public void onDestroy() {
if (mX5WebView != null) {
mX5WebView.removeAllViews();
mX5WebView.destroy();
} super.onDestroy();
} private void initViews() {
//内容显示区域
center_layout = (FrameLayout) findViewById(R.id.center_layout); mX5WebView = new X5WebView(this, null);
center_layout.addView(mX5WebView, new FrameLayout.LayoutParams(
FrameLayout.LayoutParams.MATCH_PARENT,
FrameLayout.LayoutParams.MATCH_PARENT));
} private void initDatas() {
mX5WebView.setCanBackPreviousPage(true, BrowserActivity.this);//设置可返回上一页 mX5WebView.loadUrl("http://www.baidu.com");
} private void initEvents() { } /**
* 截取返回软键事件【在activity中写,不能在自定义的X5Webview中】
*/
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) { if (keyCode == KeyEvent.KEYCODE_BACK) {
if ((keyCode == KeyEvent.KEYCODE_BACK) && mX5WebView.canGoBack()) {
mX5WebView.goBack();
return true;
} else {
finish();
return true;
}
}
return super.onKeyDown(keyCode, event);
}
}

布局文件【这三个演示Activity都是使用这个布局文件】

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"> <!-- 内容区域 -->
<FrameLayout
android:id="@+id/center_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"> </FrameLayout> </RelativeLayout>

2、展示在web端<input type=text>的标签被选择之后,文件选择器的制作和生成,参考FilechooserActivity

package com.why.project.myx5tbsdemo;

import android.annotation.TargetApi;
import android.app.Activity;
import android.content.Intent;
import android.net.Uri;
import android.os.Build;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.util.Log;
import android.view.KeyEvent;
import android.widget.FrameLayout;
import android.widget.Toast; import com.tencent.smtt.sdk.ValueCallback;
import com.why.project.myx5tbsdemo.customwebview.utils.GetPathFromUri4kitkat;
import com.why.project.myx5tbsdemo.customwebview.utils.WebviewGlobals;
import com.why.project.myx5tbsdemo.customwebview.x5webview.X5WebView;
import com.why.project.myx5tbsdemo.customwebview.x5webview.X5WebViewJSInterface; import java.io.File; /**
* Created by HaiyuKing
* Used 用于展示在web端<input type=text>的标签被选择之后,文件选择器的制作和生成
*/ public class FilechooserActivity extends AppCompatActivity {
private static final String TAG = FilechooserActivity.class.getSimpleName(); //内容显示区域
private FrameLayout center_layout;
private X5WebView mX5WebView; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_x5webview); initViews();
initDatas();
initEvents();
} @Override
public void onDestroy() {
if (mX5WebView != null) {
mX5WebView.removeAllViews();
mX5WebView.destroy();
} super.onDestroy();
} private void initViews() {
//内容显示区域
center_layout = (FrameLayout) findViewById(R.id.center_layout); mX5WebView = new X5WebView(this, null);
center_layout.addView(mX5WebView, new FrameLayout.LayoutParams(
FrameLayout.LayoutParams.MATCH_PARENT,
FrameLayout.LayoutParams.MATCH_PARENT));
} private void initDatas() {
mX5WebView.setCanBackPreviousPage(true, FilechooserActivity.this);//设置可返回上一页 mX5WebView.loadLocalUrl("demo.html");
} private void initEvents() { } /**
* 截取返回软键事件【在activity中写,不能在自定义的X5Webview中】
*/
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) { if (keyCode == KeyEvent.KEYCODE_BACK) {
if ((keyCode == KeyEvent.KEYCODE_BACK) && mX5WebView.canGoBack()) {
mX5WebView.goBack();
return true;
} else {
finish();
return true;
}
}
return super.onKeyDown(keyCode, event);
} @Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
// TODO Auto-generated method stub
super.onActivityResult(requestCode, resultCode, data);
Log.w(TAG, "{onActivityResult}resultCode="+resultCode);
Log.w(TAG, "{onActivityResult}requestCode="+requestCode); if (resultCode == Activity.RESULT_OK) {
//webview界面调用打开本地文件管理器选择文件的回调
if (requestCode == WebviewGlobals.CHOOSE_FILE_REQUEST_CODE ) {
Uri result = data == null ? null : data.getData();
Log.w(TAG,"{onActivityResult}文件路径地址:" + result.toString()); //如果mUploadMessage或者mUploadCallbackAboveL不为空,代表是触发input[type]类型的标签
if (null != mX5WebView.getX5WebChromeClient().getmUploadMessage() || null != mX5WebView.getX5WebChromeClient().getmUploadCallbackAboveL()) {
if (mX5WebView.getX5WebChromeClient().getmUploadCallbackAboveL() != null) {
onActivityResultAboveL(requestCode, data);//5.0++
} else if (mX5WebView.getX5WebChromeClient().getmUploadMessage() != null) {
mX5WebView.getX5WebChromeClient().getmUploadMessage().onReceiveValue(result);//将文件路径返回去,填充到input中
mX5WebView.getX5WebChromeClient().setmUploadMessage(null);
}
}else{
//此处代码是处理通过js方法触发的情况
Log.w(TAG,"{onActivityResult}文件路径地址(js):" + result.toString());
String filePath = GetPathFromUri4kitkat.getPath(FilechooserActivity.this,Uri.parse(result.toString())); //修改网页输入框文本【无法通过evaluateJavascript方式执行js方法,需要特殊处理】
setUrlPathInput(mX5WebView,"打开本地相册:" + filePath);
}
}
//因为拍照指定了路径,所以data值为null
if(requestCode == WebviewGlobals.CAMERA_REQUEST_CODE){
File pictureFile = new File(X5WebViewJSInterface.mCurrentPhotoPath); Uri uri = Uri.fromFile(pictureFile);
Intent intent = new Intent(Intent.ACTION_MEDIA_SCANNER_SCAN_FILE);
intent.setData(uri);
FilechooserActivity.this.sendBroadcast(intent); // 这里我们发送广播让MediaScanner 扫描我们制定的文件
// 这样在系统的相册中我们就可以找到我们拍摄的照片了【但是这样一来,就会执行MediaScanner服务中onLoadFinished方法,所以需要注意】 //拍照
// String fileName = FileUtils.getFileName(X5WebViewJSInterface.mCurrentPhotoPath);
Log.e(TAG,"WebViewJSInterface.mCurrentPhotoPath="+X5WebViewJSInterface.mCurrentPhotoPath); //修改网页输入框文本【无法通过evaluateJavascript方式执行js方法,需要特殊处理】
setUrlPathInput(mX5WebView,"打开相机:" + X5WebViewJSInterface.mCurrentPhotoPath);
} //录音
if(requestCode == WebviewGlobals.RECORD_REQUEST_CODE){
Uri result = data == null ? null : data.getData();
Log.w(TAG,"录音文件路径地址:" + result.toString());//录音文件路径地址:content://media/external/audio/media/111 String filePath = GetPathFromUri4kitkat.getPath(FilechooserActivity.this,Uri.parse(result.toString()));
Log.w(TAG,"录音文件路径地址:" + filePath); //修改网页输入框文本【无法通过evaluateJavascript方式执行js方法,需要特殊处理】
setUrlPathInput(mX5WebView,"打开录音:" + filePath);
}
} else if(resultCode == RESULT_CANCELED){//resultCode == RESULT_CANCELED 解决不选择文件,直接返回后无法再次点击的问题
if (mX5WebView.getX5WebChromeClient().getmUploadMessage() != null) {
mX5WebView.getX5WebChromeClient().getmUploadMessage().onReceiveValue(null);
mX5WebView.getX5WebChromeClient().setmUploadMessage(null);
}
if (mX5WebView.getX5WebChromeClient().getmUploadCallbackAboveL() != null) {
mX5WebView.getX5WebChromeClient().getmUploadCallbackAboveL().onReceiveValue(null);
mX5WebView.getX5WebChromeClient().setmUploadCallbackAboveL(null);
}
}
} //5.0以上版本,由于api不一样,要单独处理
@TargetApi(Build.VERSION_CODES.LOLLIPOP)
private void onActivityResultAboveL(int requestCode, Intent data) { if (mX5WebView.getX5WebChromeClient().getmUploadCallbackAboveL() == null) {
return;
}
Uri result = null;
if (requestCode == WebviewGlobals.CHOOSE_FILE_REQUEST_CODE) {//打开本地文件管理器选择图片
result = data.getData();
} else if (requestCode == WebviewGlobals.CAMERA_REQUEST_CODE) {//调用相机拍照
File pictureFile = new File(X5WebViewJSInterface.mCurrentPhotoPath); Uri uri = Uri.fromFile(pictureFile);
Intent intent = new Intent(Intent.ACTION_MEDIA_SCANNER_SCAN_FILE);
intent.setData(uri);
FilechooserActivity.this.sendBroadcast(intent); // 这里我们发送广播让MediaScanner 扫描我们制定的文件
// 这样在系统的相册中我们就可以找到我们拍摄的照片了【但是这样一来,就会执行MediaScanner服务中onLoadFinished方法,所以需要注意】 result = Uri.fromFile(pictureFile);
}
Log.w(TAG,"{onActivityResultAboveL}文件路径地址:"+result.toString());
mX5WebView.getX5WebChromeClient().getmUploadCallbackAboveL().onReceiveValue(new Uri[]{result});//将文件路径返回去,填充到input中
mX5WebView.getX5WebChromeClient().setmUploadCallbackAboveL(null);
return;
} //设置网页上的文件路径输入框文本
private void setUrlPathInput(X5WebView webView, String urlPath) {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
webView.evaluateJavascript("setInputText('"+ urlPath +"')", new ValueCallback<String>() {
@Override
public void onReceiveValue(String value) {
Log.i(TAG, "onReceiveValue value=" + value);
}});
}else{
Toast.makeText(FilechooserActivity.this,"当前版本号小于19,无法支持evaluateJavascript,需要使用第三方库JSBridge", Toast.LENGTH_SHORT).show();
}
}
}

3、演示X5webview实现视频的全屏播放功能 ,参考FullScreenActivity

package com.why.project.myx5tbsdemo;

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.KeyEvent;
import android.widget.FrameLayout;
import android.widget.Toast; import com.why.project.myx5tbsdemo.customwebview.x5webview.X5WebView; /**
* Created by HaiyuKing
* Used 用于演示X5webview实现视频的全屏播放功能 其中注意 X5的默认全屏方式 与 android 系统的全屏方式
*/ public class FullScreenActivity extends AppCompatActivity {
private static final String TAG = FullScreenActivity.class.getSimpleName(); //内容显示区域
private FrameLayout center_layout;
private X5WebView mX5WebView; @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_x5webview); initViews();
initDatas();
initEvents();
} @Override
public void onDestroy() {
if (mX5WebView != null) {
mX5WebView.removeAllViews();
mX5WebView.destroy();
} super.onDestroy();
} private void initViews() {
//内容显示区域
center_layout = (FrameLayout) findViewById(R.id.center_layout); mX5WebView = new X5WebView(this, null);
center_layout.addView(mX5WebView, new FrameLayout.LayoutParams(
FrameLayout.LayoutParams.MATCH_PARENT,
FrameLayout.LayoutParams.MATCH_PARENT));
} private void initDatas() {
mX5WebView.setCanBackPreviousPage(true, FullScreenActivity.this);//设置可返回上一页 enablePageVideoFunc();//设置视频播放样式 mX5WebView.loadUrl("http://live.hkstv.hk.lxdns.com/live/hks/playlist.m3u8");
} private void initEvents() { } /**
* 截取返回软键事件【在activity中写,不能在自定义的X5Webview中】
*/
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) { if (keyCode == KeyEvent.KEYCODE_BACK) {
if ((keyCode == KeyEvent.KEYCODE_BACK) && mX5WebView.canGoBack()) {
mX5WebView.goBack();
return true;
} else {
finish();
return true;
}
}
return super.onKeyDown(keyCode, event);
} //恢复webkit初始状态
private void disableX5FullscreenFunc() {
if (mX5WebView.getX5WebViewExtension() != null) {
Toast.makeText(this, "恢复webkit初始状态", Toast.LENGTH_LONG).show();
Bundle data = new Bundle();
data.putBoolean("standardFullScreen", true);// true表示标准全屏,会调起onShowCustomView(),false表示X5全屏;不设置默认false,
data.putBoolean("supportLiteWnd", false);// false:关闭小窗;true:开启小窗;不设置默认true,
data.putInt("DefaultVideoScreen", 2);// 1:以页面内开始播放,2:以全屏开始播放;不设置默认:1 mX5WebView.getX5WebViewExtension().invokeMiscMethod("setVideoParams", data);
//设置WebView是否通过手势触发播放媒体,默认是true,需要手势触发。
mX5WebView.getSettings().setMediaPlaybackRequiresUserGesture(false);
//接口禁止(直接或反射)调用,避免视频画面无法显示
mX5WebView.setDrawingCacheEnabled(true);
}
} //开启X5全屏播放模式
private void enableX5FullscreenFunc() { if (mX5WebView.getX5WebViewExtension() != null) {
Toast.makeText(this, "开启X5全屏播放模式", Toast.LENGTH_LONG).show();
Bundle data = new Bundle(); data.putBoolean("standardFullScreen", false);// true表示标准全屏,false表示X5全屏;不设置默认false, data.putBoolean("supportLiteWnd", false);// false:关闭小窗;true:开启小窗;不设置默认true, data.putInt("DefaultVideoScreen", 2);// 1:以页面内开始播放,2:以全屏开始播放;不设置默认:1 mX5WebView.getX5WebViewExtension().invokeMiscMethod("setVideoParams", data);
//设置WebView是否通过手势触发播放媒体,默认是true,需要手势触发。
mX5WebView.getSettings().setMediaPlaybackRequiresUserGesture(false);
//接口禁止(直接或反射)调用,避免视频画面无法显示
mX5WebView.setDrawingCacheEnabled(true);
}
} //开启小窗模式
private void enableLiteWndFunc() {
if (mX5WebView.getX5WebViewExtension() != null) {
Toast.makeText(this, "开启小窗模式", Toast.LENGTH_LONG).show();
Bundle data = new Bundle(); data.putBoolean("standardFullScreen", false);// true表示标准全屏,会调起onShowCustomView(),false表示X5全屏;不设置默认false, data.putBoolean("supportLiteWnd", true);// false:关闭小窗;true:开启小窗;不设置默认true, data.putInt("DefaultVideoScreen", 2);// 1:以页面内开始播放,2:以全屏开始播放;不设置默认:1 mX5WebView.getX5WebViewExtension().invokeMiscMethod("setVideoParams", data);
//设置WebView是否通过手势触发播放媒体,默认是true,需要手势触发。
mX5WebView.getSettings().setMediaPlaybackRequiresUserGesture(false);
//接口禁止(直接或反射)调用,避免视频画面无法显示
mX5WebView.setDrawingCacheEnabled(true);
}
} //页面内全屏播放模式
private void enablePageVideoFunc() {
if (mX5WebView.getX5WebViewExtension() != null) {
Toast.makeText(this, "页面内全屏播放模式", Toast.LENGTH_LONG).show();
Bundle data = new Bundle(); data.putBoolean("standardFullScreen", false);// true表示标准全屏,会调起onShowCustomView(),false表示X5全屏;不设置默认false, data.putBoolean("supportLiteWnd", false);// false:关闭小窗;true:开启小窗;不设置默认true, data.putInt("DefaultVideoScreen", 1);// 1:以页面内开始播放,2:以全屏开始播放;不设置默认:1 mX5WebView.getX5WebViewExtension().invokeMiscMethod("setVideoParams", data);
//设置WebView是否通过手势触发播放媒体,默认是true,需要手势触发。
mX5WebView.getSettings().setMediaPlaybackRequiresUserGesture(false);
//接口禁止(直接或反射)调用,避免视频画面无法显示
mX5WebView.setDrawingCacheEnabled(true);
}
} }

混淆配置

参考资料

Android在项目中接入腾讯TBS浏览器WebView的教程与注意的地方

项目demo下载地址

https://github.com/haiyuKing/MyX5TbsDemo

上一篇:Paip.声明式编程以及DSL 总结


下一篇:jQuery源码分析系列(40): 动画设计