移动端 使用X5 内核 html自动播放视频
1.首先集成配置X5内核
1. 集成
SDK下载链接:
.html
如果是Android Studio用户将 相应的jar包放在 jniLibs 文件夹下,如果是Eclipse用户,放在libs文件夹下即可。
x5暂时不提供64位so文件,为了保证64位手机能正常加载x5内核,如果使用是Eclipse则需要将所有的.so文件都放置在so加载目录:lib/armeabi文件夹下
如果使用的是 Android studio则需要进行两项配置,
(1)打开对应module中的build.gradle文件,在文件的android{}中的defaultConfig{}里(如果没有defaultConfig{}则手动添加)添加如下配置: ndk{abiFilters “armeabi”},如果配置后编译报错,那么需要在gradle.properties文件中加上Android.useDeprecatedNdk=true;
(2)找出build.gradle中配置的so加载目录:jniLibs.srcDir:customerDir,如果没有该项配置则so加载目录默认为:src/main/jniLibs,需要将.so文件都放置在so加载目录的armeabi文件夹下(没有该目录则新建一个,AP中没有使用到.so文件则需要拷贝任意一个32位的so文件到该目录下,如果没有合适的so可以到官网.html下载官网“SDK接入示例“,拷贝对应目录下的liblbs.so文件),so加载目录下不要有其他以”armeabi“开头的文件夹。
配置
App 首次就可以加载 x5 内核,在Application中进行配置,在Manifest中修改Application的名字
android:name="com.tzl.testapp.App"
public class App extends Application {private static Context context;@Overridepublic void onCreate() {super.onCreate();// 搜集本地tbs内核信息并上报服务器,服务器返回结果决定使用哪个内核。// TbsDownloader.needDownload(getApplicationContext(), false);QbSdk.PreInitCallback cb = new QbSdk.PreInitCallback() {@Overridepublic void onViewInitFinished(boolean arg0) {Log.e("app", " onViewInitFinished is " + arg0);}@Overridepublic void onCoreInitFinished() {}};QbSdk.setTbsListener(new TbsListener() {@Overridepublic void onDownloadFinish(int i) {Log.d("app", "onDownloadFinish is " + i);}@Overridepublic void onInstallFinish(int i) {Log.d("app", "onInstallFinish is " + i);}@Overridepublic void onDownloadProgress(int i) {Log.d("app", "onDownloadProgress:" + i);}});QbSdk.initX5Environment(getApplicationContext(), cb);}
}
3.使用
在XML文件中使用X5的webView
<FrameLayout xmlns:android=""xmlns:tools=""android:id="@+id/framelayout" android:layout_width="match_parent"android:layout_height="match_parent"tools:context="${relativePackage}.${activityClass}" ><com.tencent.smtt.sdk.WebViewandroid:id="@+id/webview" android:layout_width="match_parent" android:layout_height="match_parent" />
</FrameLayout >
编写html文件
<script type="text/javascript"> function myFunction() { var videos = document.getElementById('vi'); videos.loop = 'loop'; videos.play(); } </script> <body onload="myFunction();"><div class="item videoItem"><video id="vi" controls preload="metadata" title="Big Buck Bunny" playsinline x5-video-player-type="h5" x5-video-player-fullscreen="true"><source src=".ogv" type="video/ogv" /><source src=".m4v" type="video/mp4" /></video><div class="txt">test</div></div></body>
在 内 添加onload 属性 参数为调用播放的js方法的方法名,同时声明 playsinline x5-video-player-type=”h5” x5-video-player-fullscreen=”true” 两个属性
Android 部分
监听html的加载,在加载完成后调用播放视频的JS代码
public class MyWebviewCient extends WebViewClient{ @SuppressLint("NewApi")@Override public WebResourceResponse shouldInterceptRequest(WebView view, String url) { WebResourceResponse response = null; response = super.shouldInterceptRequest(view, url); return response; } @Override public void onPageFinished(WebView view, String url) { super.onPageFinished(view, url); Log.d("dream", "***on page finished"); webView.loadUrl("javascript:myFunction()"); } }
设置监听
webView.setWebViewClient(new MyWebviewCient());
以上就是全部了。
移动端 使用X5 内核 html自动播放视频
1.首先集成配置X5内核
1. 集成
SDK下载链接:
.html
如果是Android Studio用户将 相应的jar包放在 jniLibs 文件夹下,如果是Eclipse用户,放在libs文件夹下即可。
x5暂时不提供64位so文件,为了保证64位手机能正常加载x5内核,如果使用是Eclipse则需要将所有的.so文件都放置在so加载目录:lib/armeabi文件夹下
如果使用的是 Android studio则需要进行两项配置,
(1)打开对应module中的build.gradle文件,在文件的android{}中的defaultConfig{}里(如果没有defaultConfig{}则手动添加)添加如下配置: ndk{abiFilters “armeabi”},如果配置后编译报错,那么需要在gradle.properties文件中加上Android.useDeprecatedNdk=true;
(2)找出build.gradle中配置的so加载目录:jniLibs.srcDir:customerDir,如果没有该项配置则so加载目录默认为:src/main/jniLibs,需要将.so文件都放置在so加载目录的armeabi文件夹下(没有该目录则新建一个,AP中没有使用到.so文件则需要拷贝任意一个32位的so文件到该目录下,如果没有合适的so可以到官网.html下载官网“SDK接入示例“,拷贝对应目录下的liblbs.so文件),so加载目录下不要有其他以”armeabi“开头的文件夹。
配置
App 首次就可以加载 x5 内核,在Application中进行配置,在Manifest中修改Application的名字
android:name="com.tzl.testapp.App"
public class App extends Application {private static Context context;@Overridepublic void onCreate() {super.onCreate();// 搜集本地tbs内核信息并上报服务器,服务器返回结果决定使用哪个内核。// TbsDownloader.needDownload(getApplicationContext(), false);QbSdk.PreInitCallback cb = new QbSdk.PreInitCallback() {@Overridepublic void onViewInitFinished(boolean arg0) {Log.e("app", " onViewInitFinished is " + arg0);}@Overridepublic void onCoreInitFinished() {}};QbSdk.setTbsListener(new TbsListener() {@Overridepublic void onDownloadFinish(int i) {Log.d("app", "onDownloadFinish is " + i);}@Overridepublic void onInstallFinish(int i) {Log.d("app", "onInstallFinish is " + i);}@Overridepublic void onDownloadProgress(int i) {Log.d("app", "onDownloadProgress:" + i);}});QbSdk.initX5Environment(getApplicationContext(), cb);}
}
3.使用
在XML文件中使用X5的webView
<FrameLayout xmlns:android=""xmlns:tools=""android:id="@+id/framelayout" android:layout_width="match_parent"android:layout_height="match_parent"tools:context="${relativePackage}.${activityClass}" ><com.tencent.smtt.sdk.WebViewandroid:id="@+id/webview" android:layout_width="match_parent" android:layout_height="match_parent" />
</FrameLayout >
编写html文件
<script type="text/javascript"> function myFunction() { var videos = document.getElementById('vi'); videos.loop = 'loop'; videos.play(); } </script> <body onload="myFunction();"><div class="item videoItem"><video id="vi" controls preload="metadata" title="Big Buck Bunny" playsinline x5-video-player-type="h5" x5-video-player-fullscreen="true"><source src=".ogv" type="video/ogv" /><source src=".m4v" type="video/mp4" /></video><div class="txt">test</div></div></body>
在 内 添加onload 属性 参数为调用播放的js方法的方法名,同时声明 playsinline x5-video-player-type=”h5” x5-video-player-fullscreen=”true” 两个属性
Android 部分
监听html的加载,在加载完成后调用播放视频的JS代码
public class MyWebviewCient extends WebViewClient{ @SuppressLint("NewApi")@Override public WebResourceResponse shouldInterceptRequest(WebView view, String url) { WebResourceResponse response = null; response = super.shouldInterceptRequest(view, url); return response; } @Override public void onPageFinished(WebView view, String url) { super.onPageFinished(view, url); Log.d("dream", "***on page finished"); webView.loadUrl("javascript:myFunction()"); } }
设置监听
webView.setWebViewClient(new MyWebviewCient());
以上就是全部了。