騰訊X5內核使用詳解（X5內核播放器使用如何去除控制欄全屏播放）以及一些注意事項

時間  2019-11-20
標籤 騰訊 x5 內核 使用 詳解 播放 如何 去除 控制 全屏 以及 一些 注意事項 欄目 騰訊 简体版
原文   原文鏈接

例子下載地址 https://www.lanzous.com/i2zsv5g      GIT就不用了麻煩的不行javascript

本人安卓剛學 就上X5內核弄了老長時間因爲對maven 和idea不熟悉剛開始導包都是問題（就業人員勿參考，由於此文沒有水平）php

先上圖 解決了側邊填充不滿問題（明白什麼意思把？播放器側邊和安卓側邊有距離賊難看） 參考了http://www.cocoachina.com/cms/wap.php?action=article&id=25099html

這個騰訊的至關於其餘開源的播放器或者說瀏覽器我感受很簡單了封裝的很好就是有時候不兼容出現一萬種小問題java

正題開始 （圖少字多）android

1  本身去官網下載 tbs_sdk_thirdapp_v3.6.0.1310_43612_sharewithdownload_withoutGame_obfs_20180706_163319 個人是這個看了看半年沒更新了web

把jar包複製到安卓studio lib 目錄下 右鍵你的包 as library 添加庫（其餘添加方式也能夠）瀏覽器

2  app 下的bulid文件添加app

ndk{abiFilters "armeabi"}
具體代碼
apply plugin: 'com.android.application'

android {
    compileSdkVersion 28
    buildToolsVersion "28.0.3"
    defaultConfig {
        applicationId "com.example.avx52"
        minSdkVersion 23
        targetSdkVersion 28
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
        ndk{abiFilters "armeabi"}
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    implementation fileTree(include: ['*.jar'], dir: 'libs')
    implementation 'androidx.appcompat:appcompat:1.0.0-beta01'
    implementation 'android.arch.navigation:navigation-fragment:1.0.0-alpha09'
    implementation 'androidx.constraintlayout:constraintlayout:1.1.2'
    implementation 'com.android.support:appcompat-v7:26.1.0'
    implementation 'com.android.support.constraint:constraint-layout:1.1.3'
    testImplementation 'junit:junit:4.12'
    androidTestImplementation 'androidx.test:runner:1.1.0-alpha4'
    androidTestImplementation 'androidx.test.espresso:espresso-core:3.1.0-alpha4'
    implementation files('libs/tbs_sdk_thirdapp_v3.6.0.1310_43612_sharewithdownload_withoutGame_obfs_20180706_163319.jar')
}

　　3 把給的studio例子下的 jniLibs文件夾複製到你工程app\src\main\下的目錄  一樣把裏面那個自帶的Util文件夾複製到你java目錄的包下maven

說一下那個Util文件夾下的類他繼承了騰訊的X5webview 又一層封裝我是直接用的大佬本身寫ide

4 佈局文件

注意 

com.stdu.x5.utils.X5WebView 是你Util包路徑下的java文件什麼路徑就寫什麼
<?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" >
    <com.stdu.x5.utils.X5WebView
        android:scrollbars="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="match_parent"
        android:id="@+id/myweb">
    </com.stdu.x5.utils.X5WebView>


</RelativeLayout>

　　

5 Main窗口代碼

說白了他這仍是有問題不知道是否是個人事情小窗模式沒辦法開

package com.stdu.x5; import android.graphics.PixelFormat; import android.os.Bundle; import android.view.View; import android.view.WindowManager; import android.webkit.JavascriptInterface; import android.widget.Toast; import com.stdu.x5.utils.WebViewJavaScriptFunction; import com.stdu.x5.utils.X5WebView; import com.tencent.smtt.sdk.QbSdk; import androidx.appcompat.app.AppCompatActivity; public class MainActivity extends AppCompatActivity { private X5WebView webView; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); getSupportActionBar().hide(); getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);//全屏
 setContentView(R.layout.activity_main); webView= findViewById(R.id.myweb); getWindow().setFormat(PixelFormat.TRANSLUCENT); webView.getView().setOverScrollMode(View.OVER_SCROLL_ALWAYS); webView.setDrawingCacheEnabled(true); webView.loadUrl("file:///android_asset/webpage/fullscreenVideo.html"); enablePageVideoFunc();//窗口建立完畢開啓頁面內全屏 //隱藏滾動條
        if (webView.getX5WebViewExtension() != null) { webView.getX5WebViewExtension().setHorizontalScrollBarEnabled(false);//水平不顯示滾動按鈕
            webView.getX5WebViewExtension().setVerticalScrollBarEnabled(false); //垂直不顯示滾動按鈕
 } //添加javascript事件
         webView.addJavascriptInterface(new WebViewJavaScriptFunction() { @Override public void onJsFunctionCalled(String tag) { } @JavascriptInterface public void onX5ButtonClicked() { MainActivity.this.enableX5FullscreenFunc(); } @JavascriptInterface public void onCustomButtonClicked() { MainActivity.this.disableX5FullscreenFunc(); } @JavascriptInterface public void onLiteWndButtonClicked() { MainActivity.this.enableLiteWndFunc(); } @JavascriptInterface public void onPageVideoClicked() { MainActivity.this.enablePageVideoFunc(); } },"Android"); } //判斷內核是否加載失敗這個方法我沒調用
private  void preinitX5WebCore() { if (!QbSdk.isTbsCoreInited()) {Toast.makeText(this, "x5加載失敗", Toast.LENGTH_LONG).show(); QbSdk.initX5Environment(this, null);} Toast.makeText(this, "x5加載OK", Toast.LENGTH_LONG).show(); } private void enableX5FullscreenFunc() { if (webView.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
 webView.getX5WebViewExtension().invokeMiscMethod("setVideoParams", data); }else{ Toast.makeText(this, "開啓X5全屏播放模式失敗view爲空", Toast.LENGTH_LONG).show(); } } private void disableX5FullscreenFunc() { if (webView.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
 webView.getX5WebViewExtension().invokeMiscMethod("setVideoParams", data); } } private void enableLiteWndFunc() { if (webView.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
 webView.getX5WebViewExtension().invokeMiscMethod("setVideoParams", data); } } private void enablePageVideoFunc() { if (webView.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
 webView.getX5WebViewExtension().invokeMiscMethod("setVideoParams", data); } } //若是web頁面能返回就返回不能返回就退出
 @Override public  void onBackPressed() { if(webView.canGoBack()) {webView.goBack(); }else { finish(); } } }

 

5 mainfast.xml配置

加入權限

 <uses-permission android:name="android.permission.GET_TASKS" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
    <uses-permission android:name="android.permission.ACCESS_WIFI_STATE"/>
    <uses-permission android:name="android.permission.INTERNET"/>
    <uses-permission android:name="android.permission.READ_PHONE_STATE"/>

　　

播放窗口的activity 加入以下配置
android:alwaysRetainTaskState="true"
android:configChanges="orientation|screenSize|keyboardHidden"
代碼
 <activity android:name=".MainActivity"
            android:alwaysRetainTaskState="true"
            android:configChanges="orientation|screenSize|keyboardHidden">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>

　　最後 由於他是和html交互的html代碼以下 這個找了好長時間全屏 隱藏控制欄

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, maximum-scale=1, minimum-scale=1, user-scale=1">
    <title></title>
<style>
html,body,.main{   width: 100%;   height: 100%;   overflow: hidden;  background: #FFF;   box-sizing:border-box;}
.videobox{   position: fixed;   left: 0;   top: 0; right:0;  width: 101%;   height: 100%;}
</style>
</head>

</script>
<body>
   <div class="videobox" ontouchmove="return false;">
        <video poster="img/start.jpg" style="width:100%; height: auto;object-fit: fill;"  controls="controls" preload="auto" webkit-playsinline="" playsinline="" x5-playsinline=""  >
           <source src=https://bobo.kukucdn.com/20190125/4714_f2b52c41/index.m3u8>
        </video>

         <div style="width:100%;height: 25px;"></div>
        <button onclick="click_x5()"  style="width:50%;height: 50px; float: left"> x5模式全屏</button>
        <button onclick="click_normal()"  style="width:50%;height: 50px;"> 普通模式全屏</button>
        <div class="line"></div>
        <button onclick="click_LiteWnd()"  style="width:50%;height: 50px; float: left"> 小窗模式</button>
        <button onclick="click_normal()"  style="width:50%;height: 50px;"> 關閉小窗模式</button>
        <div class="line"></div>
        <button onclick="click_PageVideo()"  style="width:50%;height: 50px; float: left"> 頁面內全屏</button>
        <button onclick="click_normal()"  style="width:50%;height: 50px;"> 關閉頁面內全屏</button>
        <a href="index2.html"> 點我跳轉頁面</a>
   </div>

</body>


<script type="text/javascript" >
    function click_x5 (){
       Android.onX5ButtonClicked();
        location.reload(false);

    }
    function click_normal(){
        Android.onCustomButtonClicked();
        location.reload(false);
    }
    function click_LiteWnd(){
        Android.onLiteWndButtonClicked();
        location.reload(false);
    }
    function click_PageVideo(){
        Android.onPageVideoClicked();
        location.reload(false);
    }

</script>
</html>

　　說一下若是你沒辦法全屏 或者全屏崩潰之類的多是包沒導好或者配置有問題，弄了一下午終於弄好了

啓動窗口建立完畢初始化內核代碼轉 https://www.cnblogs.com/mucun/p/6407036.html  （發現啓動後不初始化調用播放器很慢卡）

// 在 application 裏面加入 
@Override
    public void onCreate() {
        super.onCreate();

        preinitX5WebCore();
        //預加載x5內核
        Intent intent = new Intent(this, AdvanceLoadX5Service.class);
        startService(intent);
    }

    private void preinitX5WebCore() {
        if (!QbSdk.isTbsCoreInited()) {
            QbSdk.preInit(getApplicationContext(), null);// 設置X5初始化完成的回調接口
        }
    }


// x5 init service
public class AdvanceLoadX5Service extends Service {
    @Nullable
    @Override
    public IBinder onBind(Intent intent) {
        return null;
    }

    @Override
    public void onCreate() {
        super.onCreate();
        initX5();
    }

    private void initX5() {
        //  預加載X5內核
        QbSdk.initX5Environment(getApplicationContext(), cb);
    }

    QbSdk.PreInitCallback cb = new QbSdk.PreInitCallback() {

        @Override
        public void onViewInitFinished(boolean arg0) {
            // TODO Auto-generated method stub
            //初始化完成回調
        }

        @Override
        public void onCoreInitFinished() {
            // TODO Auto-generated method stub
        }
    };

}
View Code
相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程