Android 使用WebView 实现播放爱奇艺视频,可全屏(使用的腾讯的X5内核) (一)

项目中有个需求,播放爱奇艺的视频,百度了一通,可能是搜索词有问题,没找到解决方法,后来无意中发现微信可以播放,就想到是否可以使用微信的x5内核,一试发现可以实现。想要实现的效果如下,点击全屏后全屏播放。


首先,使用原生WebView播放爱奇艺的视频,爱奇艺的视频url 如下:

http://dispatcher.video.iqiyi.com/common/shareplayer.html?rel=0&autoplay=1&vid=96f0abef35b4b3a32c6e86738c795868&tvId=959656600&coop=coop_244_af&cid=&aid=223135601&bd=1

直接加载无法播放,而且我们需要控制播放。自动播放,还有全屏播放。

直接接入TBS内核。

TBS内核官网

1.下载TBS X5 SDK

下载你需要的版本,我使用的完整版本。

找到SDK 中的jar文件,添加到项目中的libs目录下,右键执行Add as Library

2.找到jniLibs下的.so文件,添加到自己的项目

刚才下载的SDK 中,有一个SDK接入示例-Android StudioDemo有我们要的.so文件

jniLibs整个copy到项目对应位置。

在项目的build.gradle defaultConfig {}中配置

    defaultConfig {
        applicationId "com.aoben.playvideodemo"
        minSdkVersion 19
        targetSdkVersion 25
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
        ndk {
            abiFilters "armeabi", "armeabi-v7a", "x86", "mips"
        }
    }

3.在AndroidManifest.xml里配置权限


    <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" />

4.在Application的onCreate()方法中,初始化X5内核

a.App 在启动后(例如在 Application 的 onCreate 中)立刻调用 QbSdk 的预加载接口 initX5Environment ,可参考接入示例,第一个参数传入 context,第二个参数传入 callback,不需要 callback 的可以传入 null,initX5Environment 内部会创建一个线程向后台查询当前可用内核版本号,这个函数内是异步执行所以不会阻塞 App 主线程,这个函数内是轻量级执行所以对 App 启动性能没有影响,当 App 后续创建 webview 时就可以首次加载 x5 内核了

public class PlayVideoApplication extends Application {
    @Override
    public void onCreate() {
        super.onCreate();
        QbSdk.initX5Environment(this, new QbSdk.PreInitCallback() {
            @Override
            public void onCoreInitFinished() {

            }

            @Override
            public void onViewInitFinished(boolean b) {

            }
        });
    }
}

b.目前,由于SDK WebView所提供的WebView类,是对系统WebView的聚合包装,所以:获取系统内核的WebView或者 x5内核的WebView的宽高

android 系统内核

android.webkit.WebView webView = new android.webkit.WebView(this);
int width = webView.getWidth();

x5 内核

com.tencent.smtt.sdk.WebView webView = new com.tencent.smtt.sdk.WebView(this);
int width = webView.getView().getWidth();

5.播放视频的Activity配置

兼容视频播放:

1)享受页面视频的完整播放体验需要做如下声明:

页面的Activity需要声明android:configChanges="orientation|screenSize|keyboardHidden"

2)视频为了避免闪屏和透明问题,需要如下设置
a)网页中的视频,上屏幕的时候,可能出现闪烁的情况,需要如下设置:Activity在onCreate时需要设置:

getWindow().setFormat(PixelFormat.TRANSLUCENT);(这个对宿主没什么影响,建议声明)

b)在非硬绘手机和声明需要controller的网页上,视频切换全屏和全屏切换回页面内会出现视频窗口透明问题,需要如下设置

声明当前<item name="android:windowIsTranslucent">false为不透明。
特别说明:这个视各app情况所需,不强制需求,如果声明了,对体验更有利

c)以下接口禁止(直接或反射)调用,避免视频画面无法显示:

webview.setLayerType()
webview.setDrawingCacheEnabled(true);

6.输入法设置

避免输入法界面弹出后遮挡输入光标的问题
方法一:在AndroidManifest.xml中Activity设置

android:windowSoftInputMode="stateHidden|adjustResize"

方法二:在代码中动态设置:

getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE | WindowManager.LayoutParams.SOFT_INPUT_STATE_HIDDEN);

6.APP混淆处理

由于我们提供的 TBS jar 已经混淆过,所以 App 混淆时可以不再混淆我们的 TBS jar,或者也可以把我们的混淆策略 proguard 点击下载 加入 App 的混淆策略里注意:如果 App没有按照该规则混淆了 TBS jar,可能导致无法使用 x5内核

下一篇文章,Android 使用WebView 实现播放爱奇艺视频,可全屏(使用的腾讯的X5内核) (二)

参考文章:

ANDROID webview解决视频无法播放问题

Android Webview加载网页视频播放遇到的坑
xumingwang / youkes_browser

webview加载腾讯视频功能的实现

抛弃Android自带webview,使用腾讯qq浏览器x5内核的webview浏览器

Android中接入腾讯TBS浏览器WebView的入坑指南

基于WebView的封装,支持原生和腾讯X5内核切换,支持下拉刷新和进度显示并且做了兼容判断

Android Studio 使用腾讯浏览服务(替换掉系统自带的WebView)

TBS(腾讯浏览服务)

  • 1
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值