更新记录

1.1.6（2021-02-18）

更新日志

1.添加Android和iOS的url解析视频播放

2.尝试修复存在问题

注：请不要使用主要项目升级插件，先进行测试，问题尽快反馈

1.1.5（2020-09-01）

更新日志，交流及问题反馈QQ群：609882821

1.修复安卓高版本播放m3u8视频闪退问题
2.更新播放器底层基座

1.1.4（2020-08-31）

更新日志，交流及问题反馈QQ群：609882821

1.修复反馈的安卓无法正常播放m3u8资源问题

2.优化安卓可能造成卡顿的隐患

3.优化播放器速度

查看更多

平台兼容性

Android Android CPU类型 iOS
适用版本区间：4.4 - 11.0 armeabi-v7a：支持，arm64-v8a：未测试，x86：未测试 适用版本区间：10 - 14

原生插件通用使用流程：

  1. 购买插件，选择该插件绑定的项目。
  2. 在HBuilderX里找到项目，在manifest的app原生插件配置中勾选模块，如需要填写参数则参考插件作者的文档添加。
  3. 根据插件作者的提供的文档开发代码，在代码中引用插件，调用插件功能。
  4. 打包自定义基座，选择插件，得到自定义基座，然后运行时选择自定义基座，进行log输出测试。
  5. 开发完毕后正式云打包

付费原生插件目前不支持离线打包。
Android 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/android
iOS 离线打包原生插件另见文档 https://nativesupport.dcloud.net.cn/NativePlugin/offline_package/ios

注意事项：使用HBuilderX2.7.14以下版本，如果同一插件且同一appid下购买并绑定了多个包名，提交云打包界面提示包名绑定不一致时，需要在HBuilderX项目中manifest.json->“App原生插件配置”->”云端插件“列表中删除该插件重新选择

JKJ-VideoView

简介

JKJ-VideoView插件致力于让开发者一键实现功能强大的播放器。

插件问题反馈交流群：609882821

插件使用前准备

一、选择试用插件

avatar

二、开启视频播放

avatar

三、添加权限

avatar

四、打包自定义基座

avatar

五、使用自定义基座运行

avatar

六、在nvue界面中添加播放器及引入插件

avatar

注：播放器必须在nvue界面使用，无法在vue界面使用！！！！

模块接口

setJsCallback

设置回调函数

//设置回调函数
videoView.setJsCallback(this.jsCallback);

this.jsCallback = function(res) {
    if (res.type == "FullScreenPlay") {
        //开始全屏播放回调
    } else if (res.type == "FloatWindowPlay") {
        //开始悬浮播放
    } else if (res.type == "onStopFullScreenPlay") {
        //退出全屏回调
    } else if (res.type == "play_callback") {
        //console.log("按钮回调输出",res.data.vod_id,that.qpdgjs)
    } else if (res.type == "onclick") {
        //所有点击回调
        if(res.data.event == "sus_advert"){
            //点击暂停广告回调
        }else if(res.data.event == "Close_advert"){
            //点击了关闭贴片广告按钮
            var videoView = that.$refs.videoView1;
            videoView.Close_tpadvert();
        }else if(res.data.event == "Onclick_advert"){
            //点击了贴片广告
        }else if(res.data.event == "live_zt"){
            //直播源控制双击暂停，请不要删除否则无法暂停视频
            var videoView = that.$refs.videoView1;
            videoView.pause();
        }
    } else if (res.type == "onPlayEvent") {
        if (res.data.event == 2006) {
            //console.log("播放结束");
        } else if (res.data.event == 2004) {
            //console.log("开始播放");
        } else if (res.data.event == 2007) {
            //console.log("加载中");
        } else if (res.data.event == 2014) {
            //console.log("加载完成");
        } else if (res.data.event == 2013) {
            //console.log("播放器已准备完成，可以播放");
        } else if (res.data.event == 2005) {
            //console.log("播放器进度");
            //console.log(res.data);
        }
    }
}

play

视频播放接口

注：iOS中因为其底层加载逻辑此接口不能直接放在onLoad()事件中，具体使用方式请看下方iOS处理方式
//设置播放源开始播放
videoView.play(
    [{
        //appid:"1252463788",
        title: 'mp4视频演示链接',   //全屏视频标题
        title1: 'mp4',              //选集界面内容
        // videoId:{
        //  fileId:'4564972819220421305'
        //  pSign:""
        // },
        url: 'http://200024424.vod.myqcloud.com/200024424_709ae516bdf811e6ad39991f76a4df69.f20.mp4',
        qualityName: '原画',
        multiURLs: [{
            url: 'http://200024424.vod.myqcloud.com/200024424_709ae516bdf811e6ad39991f76a4df69.f20.mp4',
            qualityName: '原画',
        }, ]
    }, {
        //appid:"1252463788",
        title: '直播演示链接',
        title1: '直播',
        // videoId:{
        //  fileId:'4564972819220421305'
        // },
        url: 'http://liteavapp.qcloud.com/live/liteavdemoplayerstreamid.flv',
        qualityName: '高清',
        multiURLs: [{
            url: 'http://liteavapp.qcloud.com/live/liteavdemoplayerstreamid.flv',
            qualityName: '原画',
        }, ]
    }], 
    0       //0表示播放第几个视频(不能超出上面的列表)
);

pause

暂停播放

this.$refs.videoView1.pause();

resume

恢复播放

this.$refs.videoView1.resume();

startDownloadUrl

视频下载接口

var downloadPath = "/";                 //下载路径
var downloadUrl = "https://v1.szjal.cn/20190902/mE3vo0vA/index.m3u8";       //下载url
//下载文件
jkjsdkwx.startDownloadUrl(downloadPath, downloadUrl, function(res) {
    console.log(res);
});

stopDownload

暂停下载

var downloadUrl = "https://v1.szjal.cn/20190902/mE3vo0vA/index.m3u8";       //下载url
jkjsdkwx.stopDownload(downloadUrl);

stopAllDownload

暂停所有下载

jkjsdkwx.stopAllDownload();

deleteDownloadFile

删除下载文件

var downloadPath = "/abc.m3u8";                 //下载路径
jkjsdkwx.deleteDownloadFile(downloadPath);

seekTo

指定视频播放时间

var videoView = this.$refs.videoView1;
videoView.seekTo(25); //这个是int

addDanmaku

发送弹幕(单个)

var videoView = this.$refs.videoView1;
videoView.addDanmaku("弹幕1");

addDanmakus

发送弹幕(单个)

var videoView = this.$refs.videoView1;
videoView.addDanmakus(["弹幕1","弹幕2"]);

stopFullScreenPlay

退出全屏

var videoView = this.$refs.videoView1;
videoView.stopFullScreenPlay();

resetPlayer

销毁播放器

var videoView = this.$refs.videoView1;
videoView.resetPlayer();

setBrightness

设置屏幕亮度

var videoView = this.$refs.videoView1;
videoView.setBrightness(0.4);

getBrightness

获取屏幕亮度

var videoView = this.$refs.videoView1;
videoView.getBrightness();

setRenderRotation

设置画面旋转(非控件整体选择)

var videoView = this.$refs.videoView1;
videoView.setRenderRotation(90);        //可选项：0,90,180,270

show_advert

设置贴片视频广告内容

var videoView = this.$refs.videoView1;
videoView.show_advert({
    "tp_zt": 0,                                                                         //  1:播放广告    0:不播放广告
    "tp_url": "http://vfx.mtime.cn/Video/2019/02/04/mp4/190204084208765161.mp4",        //支持格式：mp4，3GP
    "tp_String": "开通VIP关闭广告"                                                      //视频右上角红色提示文字，可动态切换。
});

setadvert

设置暂停悬浮广告

var videoView = this.$refs.videoView1;
videoView.setadvert("http://www.baidu.com/upload/vod/20200109-1/aebc087d1c4d1fa1f3a55fe01f6072d7.jpg");

ychzh

移除安卓普通窗口画中画按钮

var videoView = this.$refs.videoView1;
videoView.ychzh();          //仅限安卓使用，iOS无此接口使用会报错

setScrollText

移除安卓普通窗口画中画按钮

var videoView = this.$refs.videoView1;
videoView.setScrollText("我是贴片滚动广告");    //内容不要过长

Close_tpadvert

关闭贴片广告

var videoView = this.$refs.videoView1;
videoView.Close_tpadvert();

onSwitchPlayMode

设置播放模式

var videoView = this.$refs.videoView1;
videoView.onSwitchPlayMode(0);              //退出全屏及悬浮窗

cq_tpadvert

重新显示暂停广告

var videoView = this.$refs.videoView1;
videoView.cq_tpadvert();              //退出全屏及悬浮窗

IOS在onLoad()中实现自动播放

setJsCallback

控件初始化

<script>
var jkjsdkwx = uni.requireNativePlugin('JKJ-VideoView');
export default {
    onLoad: function() {
        jkjsdkwx.setJsCallback(this.jsCallback);
    }
}
</script>

play

自动播放视频

onLoad(){
    uni.request({
        url:"http://127.0.0.1"
        success:(res) => {
            jkjsdkwx.play(
                [{
                    //appid:"1252463788",
                    title: 'mp4视频演示链接',   //全屏视频标题
                    title1: 'mp4',              //选集界面内容
                    // videoId:{
                    //  fileId:'4564972819220421305'
                    //  pSign:""
                    // },
                    url: 'http://200024424.vod.myqcloud.com/200024424_709ae516bdf811e6ad39991f76a4df69.f20.mp4',
                    qualityName: '原画',
                    multiURLs: [{
                        url: 'http://200024424.vod.myqcloud.com/200024424_709ae516bdf811e6ad39991f76a4df69.f20.mp4',
                        qualityName: '原画',
                    }, ]
                }, {
                    //appid:"1252463788",
                    title: '直播演示链接',
                    title1: '直播',
                    // videoId:{
                    //  fileId:'4564972819220421305'
                    // },
                    url: 'http://liteavapp.qcloud.com/live/liteavdemoplayerstreamid.flv',
                    qualityName: '高清',
                    multiURLs: [{
                        url: 'http://liteavapp.qcloud.com/live/liteavdemoplayerstreamid.flv',
                        qualityName: '原画',
                    }, ]
                }], 
                0       //0表示播放第几个视频(不能超出上面的列表)
            );

        }
    })
}

show_advert

设置贴片视频广告内容

jkjsdkwx.show_advert({
    "tp_zt": 0,                                                                         //  1:播放广告    0:不播放广告
    "tp_url": "http://vfx.mtime.cn/Video/2019/02/04/mp4/190204084208765161.mp4",        //支持格式：mp4，3GP
    "tp_String": "开通VIP关闭广告"                                                      //视频右上角红色提示文字，可动态切换。
});

setadvert

设置暂停悬浮广告

jkjsdkwx.setadvert("http://www.baidu.com/upload/vod/20200109-1/aebc087d1c4d1fa1f3a55fe01f6072d7.jpg");

播放器页面代码编写建议

onBackPress()

屏蔽返回按钮

onBackPress(e) {
    if (e.from == 'backbutton') {
        //voidl可以保持是全屏还是窗口，这里1代表全屏模式按下返回按钮，0表示窗口模式按下全屏按钮，播放状态可以从播放器回调中获取
        if (this.voidl == 1) {
            //console.log("退出全屏")
            //退出全屏回调
            var videoView = this.$refs.videoView1;
            videoView.stopFullScreenPlay();
            videoView.cq_tpadvert();            //重启显示暂停广告
            return true;                //阻止默认返回行为
        } else {
            uni.setKeepScreenOn({
                keepScreenOn: false         //关闭屏幕常亮
            });
            var videoView = this.$refs.videoView1;
            videoView.onSwitchPlayMode(0);
            videoView.cq_tpadvert();
            videoView.resetPlayer();

            uni.navigateBack({
                delta: 1            //关闭当前界面，返回上一个界面
            })
        }
        return true; //阻止默认返回行为
    }
}

注：

经作者修改，插件内的亮度调节由原版的设置软件亮度改为设置系统亮度，并需要使用者申请setting权限及悬浮窗权限

<uses-permission android:name="android.permission.WRITE_SETTINGS" />
<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>

具体使用请下载示例项目查看

隐私、权限声明

1. 本插件需要申请的系统权限列表：

<uses-permission android:name="android.permission.WRITE_SETTINGS"/> <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明：

插件不采集任何数据，插件使用的腾讯云播放器SDK会采集数据，详情可参考：https://cloud.tencent.com/document/product/881

3. 本插件是否包含广告，如包含需详细说明广告表达方式、展示频率：

无

评论列表 撰写评论
加载更多...
插件问答 我要提问

使用中有什么不明白的地方，就向插件作者提问吧~ 我要提问

加载更多...