接入
開始搬磚
- 集成準備工作：
- 先把tbs_sdk... 還有一個liblbs.os文件放到你自己的項目里挣轨。sdk放在libs下，然后liblbs.os文件在java文件平級的jniLibs文件里度硝。那么好，第一個坑來了寿冕，下載的sdk里根本就沒有l(wèi)iblbs.os文件蕊程，官方的文檔里也沒告訴你在哪。不賣關(guān)子了驼唱，這個文件你得下他們的demo然后把demo里jniLibs里的東西拷貝到你自己的項目里藻茂。
- 然后我個人比較喜歡把.so文件也放在libs里，這里只需要在module下的build.gradle的android{...}里配置
sourceSets {
main {
jniLibs.srcDirs = ['libs']
}
}
- 官方的demo里jniLibs下只有一個armeabi文件夾玫恳，這樣我們只能在arm cpu的手機上有用還有大量的手機并沒有效果辨赐。所以接下來需要適配所有的機型。
解決辦法：
如圖京办，把其他的cpu目錄都創(chuàng)建出來肖油，然后把原liblbs.so文件一次放在各個目錄下。然后在對應(yīng)module中的build.gradle文件,在文件的android{}中的defaultConfig{}里(如果沒有defaultConfig{}則手動添加)添加如下配置:
ndk {
//選擇要添加的對應(yīng)cpu類型的.so庫臂港。
abiFilters 'armeabi', 'armeabi-v7a', 'armeabi-v8a', 'x86', 'x86_64', 'mips', 'mips64'
}
如果配置后編譯報錯森枪，那么需要在gradle.properties文件中加上Android.useDeprecatedNdk=true。
- 添加權(quán)限：
這個很常規(guī)但是不要忘了审孽。
<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" />
- 初次打開頁面的時候县袱，會有白屏，時間依據(jù)手機情況有不同佑力，這是因為X5內(nèi)核需要一個初始化的過程式散。官方給出了一個解決方案：
App 在啟動后（例如在 Application 的 onCreate 中）立刻調(diào)用 QbSdk 的預(yù)加載接口 initX5Environment.
需要注意的是： 當(dāng)本地沒有宿主x5內(nèi)核可用，此時需要在wifi條件下下載x5內(nèi)核(23M左右打颤，耗時90秒左右)暴拄，如果在此之前打開webview可能導(dǎo)致無內(nèi)核可用而使用系統(tǒng)內(nèi)核的情況
看代碼(在Application里)：
@Override
public void onCreate() {
super.onCreate();
//搜集本地tbs內(nèi)核信息并上報服務(wù)器漓滔，服務(wù)器返回結(jié)果決定使用哪個內(nèi)核。
QbSdk.PreInitCallback cb = new QbSdk.PreInitCallback() {
@Override
public void onViewInitFinished(boolean arg0) {
// TODO Auto-generated method stub
//x5內(nèi)核初始化完成的回調(diào)乖篷，為true表示x5內(nèi)核加載成功响驴，否則表示x5內(nèi)核加載失敗，會自動切換到系統(tǒng)內(nèi)核撕蔼。
Log.d("app", " onViewInitFinished is " + arg0);
}
@Override
public void onCoreInitFinished() {
// TODO Auto-generated method stub
}
};
//x5內(nèi)核初始化接口
QbSdk.initX5Environment(getApplicationContext(), cb);
}
如果你沒有需要回調(diào)的需求豁鲤，cb可以填null。（個人感覺還是會白屏一段時間）
解釋一下后面那句需要注意的：就是說你手機上有沒有類似微信鲸沮，手機QQ琳骡，QQ瀏覽器之類的集成了x5內(nèi)核的應(yīng)用，而且你之前還要在這些應(yīng)用里打開過網(wǎng)頁讼溺，不然就會去下載x5內(nèi)核楣号。
- 在簡書陳小平的一篇文章里，提出：集成X5后怒坯，項目編譯變慢了炫狱，如果項目太大的話，還不容易跑起來敬肚。然后作者也給出解決辦法：在主module的build.gradle里面加上下面這段代碼
dexOptions {
javaMaxHeapSize "4g"
preDexLibraries = false
}
到這里基本的準備工作以及做完了毕荐。
代碼
xml文件：
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:id="@+id/frame_web_video"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<com.tencent.smtt.sdk.WebView
android:id="@+id/web_filechooser"
android:layout_width="fill_parent"
android:layout_height="match_parent">
</com.tencent.smtt.sdk.WebView>
</RelativeLayout>
java:
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
getWindow().setFormat(PixelFormat.TRANSLUCENT);
setContentView(R.layout.filechooser_layout);
mWebView = (com.tencent.smtt.sdk.WebView) findViewById(R.id.web_filechooser);
//一些初始化配置
initWebViewSettings();
mWebView.loadUrl("http://res.ky-express.com/h5/video/72.html");
mWebView.getView().setClickable(true);
}
這樣基本上就可以正常運行了，用的就是騰訊瀏覽服務(wù)艳馒。
其他問題
- 視頻全屏問題：
在有視頻播放的html里憎亚，上面的代碼可以播放視頻但是當(dāng)你想全屏看的時候就不行了，出問題了弄慰。你需要加如下代碼：
// 播放視頻
Bundle data = new Bundle();
data.putBoolean("standardFullScreen", false);
data.putBoolean("supportLiteWnd", true);
data.putInt("DefaultVideoScreen", 1);
mWebView.getX5WebViewExtension().invokeMiscMethod("setVideoParams", data);
對參數(shù)做個簡要說明第美，standardFullScreen 是標準全屏還是x5全屏，如果true就是標準全屏陆爽，false就是x5全屏什往，不設(shè)置默認為false。這里需要注意如果設(shè)置是true慌闭，會回調(diào)WebChromeClient的onShowCustomView方法别威，由開發(fā)者自己實現(xiàn)全屏展示。提供一點事例代碼驴剔，回頭會上傳demo省古。
mWebView.setWebChromeClient(new WebChromeClient() {
@Override
public boolean onJsConfirm(WebView arg0, String arg1, String arg2,
JsResult arg3) {
return super.onJsConfirm(arg0, arg1, arg2, arg3);
}
View myVideoView;
View myNormalView;
IX5WebChromeClient.CustomViewCallback callback;
/**
* 全屏播放配置
*/
@Override
public void onShowCustomView(View view,
IX5WebChromeClient.CustomViewCallback customViewCallback) {
FrameLayout normalView = (FrameLayout) findViewById(R.id.frame_web_video);
ViewGroup viewGroup = (ViewGroup) normalView.getParent();
viewGroup.removeView(normalView);
viewGroup.addView(view, new FrameLayout.LayoutParams(
FrameLayout.LayoutParams.FILL_PARENT,
FrameLayout.LayoutParams.FILL_PARENT));
myVideoView = view;
myNormalView = normalView;
callback = customViewCallback;
}
@Override
public void onHideCustomView() {
if (callback != null) {
callback.onCustomViewHidden();
callback = null;
}
if (myVideoView != null) {
ViewGroup viewGroup = (ViewGroup) myVideoView.getParent();
viewGroup.removeView(myVideoView);
viewGroup.addView(myNormalView);
}
}
@Override
public boolean onJsAlert(WebView arg0, String arg1, String arg2,
JsResult arg3) {
/**
* 這里寫入你自定義的window alert
*/
return super.onJsAlert(null, arg1, arg2, arg3);
}
});
里面最關(guān)鍵的就是onShowCustomView()里的全屏播放設(shè)置，推薦使x5全屏丧失。
全屏屬性設(shè)置為false時豺妓，由我們實現(xiàn)全屏展示，我們實現(xiàn)全屏展示需要滿足下面兩個條件：
a. 我們 Webview初始化的Context必須是Activity類型的Context
b. 我們 Webview 所在的Activity要聲明這個屬性
android:configChanges="orientation|screenSize|keyboardHidden"
supportLiteWnd false的時候是關(guān)閉小窗模式，true的時候是開啟小窗模式琳拭，不設(shè)置默認為true训堆，前提standardFullScreen=false，也就是得設(shè)置x5全屏這個條件才生效白嘁。
DefaultVideoScreen 1：以頁面內(nèi)開始播放坑鱼，2：以全屏開始播放；不設(shè)置默認：1权薯。
這段視頻播放的代碼設(shè)置完了姑躲，可以全屏播放了睡扬，沒有問題盟蚣。
視頻播放小窗模式
為什么要單獨拎出來，因為這里有一個巨坑卖怜。前面的代碼已經(jīng)設(shè)置好了小窗模式屎开，但是我在運行的過程中發(fā)現(xiàn)，視頻小窗模式的效果沒有出來马靠，也沒有任何提示奄抽。然后我去運行官方的demo然而也沒有效果也沒有一點提示，這就很難過了甩鳄。官方demo里專門有一個視頻模式的模塊逞度，然而并不行。最后經(jīng)歷了一些坎坷妙啃，最終發(fā)現(xiàn)了是什么原因档泽。不賣關(guān)子了，原來小窗模式要有效果揖赴，你手機里必須安裝了QQ瀏覽器馆匿，這個小窗模式是通過QQ瀏覽器支持的，裝了QQ瀏覽器之后就沒問題了燥滑。去除全屏模式下QQ瀏覽器的推廣
在使用到X5 Webview的那個Activity里面加上這段代碼：
//去除QQ瀏覽器推廣
getWindow().getDecorView().addOnLayoutChangeListener(new View.OnLayoutChangeListener() {
@Override
public void onLayoutChange(View v, int left, int top, int right, int bottom, int oldLeft, int oldTop, int oldRight, int oldBottom) {
ArrayList<View> outView = new ArrayList<View>();
getWindow().getDecorView().findViewsWithText(outView, "QQ瀏覽器", View.FIND_VIEWS_WITH_TEXT);
int size = outView.size();
if (outView != null && outView.size() > 0) {
outView.get(0).setVisibility(View.GONE);
}
}
});
代碼下載
======補充======
如果webview有視頻全屏需求渐北，在有webview控件的那個activity里一定加上
android:configChanges="orientation|screenSize|keyboardHidden"
