MyX5TbsDemo【體驗騰訊瀏覽服務Android SDK （完整版）】

時間 2019-11-06

標籤 myx5tbsdemo myx tbsdemo 體驗騰訊瀏覽服務 android sdk 完整欄目騰訊简体版

原文原文鏈接

前言

按照官網上的說明：可獨立下載x5內核，也可共享使用微信或手Q的x5內核。java

本Demo在引用騰訊X5內核的基礎上進行了封裝。參考《MyWebViewDemo【封裝Webview經常使用配置和選擇文件、打開相機、錄音、打開本地相冊的用法】》android

使用TbsReaderView預覽文件功能，請參考《MyX5TbsPlusDemo【體驗騰訊瀏覽服務Android SDK （TbsPlus 版）】》git

效果圖

代碼分析

X5WebView ：對騰訊X5內核的webview進行了封裝；github

BrowserActivity：用於展示打開普通網頁；web

FilechooserActivity ：用於展現在web端<input type=text>的標籤被選擇以後，文件選擇器的製做和生成；api

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;）

使用步驟

1、項目組織結構圖

注意事項：

一、導入類文件後須要change包名以及從新import R文件路徑

二、 Values目錄下的文件（strings.xml、dimens.xml、colors.xml等），若是項目中存在，則複製裏面的內容，不要整個覆蓋

2、導入步驟

一、下載sdk

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

下載的文件解壓後以下：【接入文檔頗有用】

二、將jar文件導入項目中

參考《【Android Studio安裝部署系列】十7、Android studio引用第三方庫、jar、so、arr文件》

三、實現支持64位手機加載X5

將SDK接入示例-Android Studio文件中的demo項目的jniLibs目錄複製到項目的main目錄下【若是項目的main目錄中已經存在jniLibs文件夾，則只須要把so文件複製到相應armeabi目錄下】

在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中沒有添加】

四、在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>

五、在自定義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); }
}

六、在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進行了封裝，因此還須要進行下面的操做。

2、下面導入本身封裝的X5WebView

一、將customwebview包複製到項目中

二、將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

三、將x5webview_progress_dialog_img.png圖片複製到項目中

四、將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

五、在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>

六、在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>

七、將assets文件夾複製到項目中

<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

3、由於demo中使用到獲取手機本地文件的權限和調用相機功能，因此須要申請運行時權限和適配7.0FIleProvider功能。

0-一、申請運行時權限，參考《Android6.0運行時權限(基於RxPermission開源庫)》

0-二、適配Android7.0FileProvider功能，參考《AppUtils【獲取手機的信息和應用版本號、安裝apk】》

3、使用方法

一、打開普通網頁，參考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>

二、展現在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(); } }
}

三、演示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);
        }
    }

}