更新记录

1.6.3(2024-07-11)

android添加缓存事件返回

1.6.2(2024-06-24)

iOS 内核完善

1.6.1(2024-06-20)

修复下一集事件

查看更多

平台兼容性

Android Android CPU类型 iOS
适用版本区间:5.0 - 14.0 armeabi-v7a:支持,arm64-v8a:支持,x86:支持 适用版本区间:9 - 17

原生插件通用使用流程:

  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原生插件配置”->”云端插件“列表中删除该插件重新选择


#超级播放器


概述

超级播放器,功能全面,支持点播 直播 android exo,ijk内核 iOS avplayer ijkplayer 内核


模块概述

1.支持点播,直播
2.缓存,分集播放 支持 m3u8缓存
3.android 支持视频格式 m3u8,flv,mp4,webm,ts,mpd,mkv 支持rtmp直播
4.ios 支持视频格式 m3u8,flv,mp4,mov 支持rtmp直播
5.component 等自定义控件

插件集成准备事项

一,勾选官方videoPlayer Image text 二,试用 勾选云端插件: Image text 三,自定义基座: Image text 四,选定基座运行: Image text

播放器代码标签

  <oxeVideo ref='video' 
      :isLive='boxIsLive' 
      :callback='boxCallback'
      :dat a='boxDat a' 
      :style='boxStyle'></oxeVideo>

        boxStyle: { //样式 播放器 宽高
          'height': 0,
          'width': '750upx',
        },
        boxIsLive:false ,//是否直播
        boxCallback:'actionCallback',//公用监听名称多个播放器是自定义
        boxData:test_dat a //初始化数据

     注::dat a='boxDat a'  可选 没有时 需要执行 initVideoData 接口 有时 则不用在调用 initVideoData借口

温馨提示

  监听事件
  var globalEvent = weex.requireModule('globalEvent');
  globalEvent.addEventListener("actionCallback", function (e) {
           var code= e.code;
          //事件监听
          //0 小屏状态下返回按钮点击 
          //1 播放进度实时返回position 
          //2 视频广告点击事件
          //3 暂停广告点击事件
          //4 vip点击返回 
          //5 弹幕开启状态 
          //6 播放 
          //7 暂停 
          //8 缓冲返回 
          //9 网络错误 
          //10 钢笔图标点击
          //11 选集点击事件
          //12 广告详情按钮点击
          //13 大小屏切换事件
          //14 广告划过事件
          //15 广告倒计时点击事件
          //16 广告播放完成事件
          //17 播放完成事件
          //18 下一集事件
          //20 准备播放
          //27 清晰度 返回
          //24 小屏关闭事件
          //25 小屏恢复事件
    });

模块接口

initVideoData

初始化数据

let param = {
    selectAutoPlay: true, //选集点击是否自动播放 默认自动播放
    forceDeviceOrientation: false, //旋转方向 true 全屏视频不旋转
    radius: 5, //圆角大小 默认 0 没有圆角
    scaleMode:0,//0 :自动调节 默认  1自适应 2 全屏 有切边 3 全屏 android起作用 
    showBack: true, //返回按钮是否显示小屏幕
    showSelect: true, //选集按钮是否显示
    showSpeed: true, //倍速按钮是否显示
    showDefinition: true, //清晰度按钮是否显示
    showShot: true, //截图按钮是否显示
    showLock: true, //锁屏按钮是否显示
    failText:'播放失败,点击重播',//播放失败文字设定
    showDlna: {
      small: true,
      full: true
    }, //投屏按钮是否显示
    showDunmaku: {
      small: true,
      full: true
    }, //弹幕按钮是否显示
    showMore: {
      small: true,
      full: true
    }, //跟多按钮是否显示
    sliderColor:'#ff0000',
    showBottomProcess: true,
    autoPlay: false, //默认false
    openCache: true, //是否开启缓存
    styles: styles,
    hideControl: false, //是否隐藏所有控件
    backgroundHolder: '', //视频背景图片
    backgroundAlpha: 0.3, //0 背景透明度
    nextIcon:'/static/next.png',//下一集按钮 支持 http
    lockIcon:{unlock:'/static/unlock.png',lock:'widget://image/lock.png'},//锁屏按钮 支持 http
    shotIcon:'/static/capture.png',//截屏按钮 支持 http
    startIcon:'/static/start.png',//中间开始播放圆形按钮 支持 http
    playIcon:{pauseIcon:'/static/pause.png',playIcon:'/static/play.png'},//暂停播放按钮图标 支持 http
    fullSmallIcon:{fullIcon:'/static/fullscreen_exit.png',smallIcon:'/static/fullscreen.png'},//切换大小屏按钮图标 支持 http
    seekbarStyle:{progressThumb:'/static/thumb.png',progressColor:'#50CDD4',bufferColor:'#FFFFFF'},//滑动条样式 支持 http
    loop: false, //是否单急循环
    ad: {
      isShow: true,
      url: 'http://t8.baidu.com/it/u=2247852322,986532796&fm=79&app=86&f=JPEG?w=1280&h=853',
      skipUrl: 'http://wap.hao123.com'
    }, //中间暂停广告,为空则不播放广告
    vad: {
      isShow: true,
      isShowSkip: true,
      type: 'image',
      duration: 10,
      url: 'https://cms-bucket.nosdn.127.net/eb411c2810f04ffa8aaafc42052b233820180418095416.jpeg',
      skipUrl: 'http://wap.hao123.com'
    }, //播放前视频广告 
    index: 0,
    dat a: [{
        uid: '', //扩展字段 用户id(可选,会随事件返回)
        vid: '', //扩展字段 视频id(可选,会随事件返回)
        title: '第一集',
        index: '01',
        thumb: 'https://cms-bucket.nosdn.127.net/eb411c2810f04ffa8aaafc42052b233820180418095416.jpeg',
        url: 'https://v3.szjal.cn/20191120/IYfYSiin/index.m3u8',
        headers:{}//头部信息json格式
      },
      {
        uid: '', //扩展字段 用户id(可选,会随事件返回)
        vid: '', //扩展字段 视频id(可选,会随事件返回)
        title: '第二集',
        index: '02',
        thumb: 'https://cms-bucket.nosdn.127.net/cb37178af1584c1588f4a01e5ecf323120180418133127.jpeg',
        url: 'http://www.easydarwin.org/public/video/3/video.m3u8',
        headers:{}//头部信息json格式
      }
    ]
  };

var ox = this.$refs.video;
ox.initVideoData(param);

addComponent

动态添加控件 自定义控件支持html标签

示例代码

var ox = this.$refs.video;
ox.addComponent(component);
//动态添加控件 code不能重复

updateComponent

动态更新控件

示例代码

var ox = this.$refs.video;
ox.updateComponent(component);
//动态更新控件 更新的控件 code一定要对应

updateDataAtIndex

更新索引位置视频数据

示例代码

var ox = this.$refs.video;
ox.updateDataAtIndex({index:1,data:{
            uid: '', //扩展字段 用户id(可选,会随事件返回)
            vid: '', //扩展字段 视频id(可选,会随事件返回)
            title: '第二集',
            index: '02',
            thumb: 'https://cms-bucket.nosdn.127.net/cb37178af1584c1588f4a01e5ecf323120180418133127.jpeg',
            url: 'http://vfx.mtime.cn/Video/2019/03/21/mp4/190321153853126488.mp4',
          }});

updateAll

更新所有视频数据

示例代码

var ox = this.$refs.video;
ox.updateAll({data:[{
            uid: '', //扩展字段 用户id(可选,会随事件返回)
            vid: '', //扩展字段 视频id(可选,会随事件返回)
            title: '第一集',
            index: '01',
            thumb: 'https://cms-bucket.nosdn.127.net/eb411c2810f04ffa8aaafc42052b233820180418095416.jpeg',
            url: 'http://vfx.mtime.cn/Video/2019/02/04/mp4/190204084208765161.mp4'
          },
          {
            uid: '', //扩展字段 用户id(可选,会随事件返回)
            vid: '', //扩展字段 视频id(可选,会随事件返回)
            title: '第二集',
            index: '02',
            thumb: 'https://cms-bucket.nosdn.127.net/cb37178af1584c1588f4a01e5ecf323120180418133127.jpeg',
            url: 'http://vfx.mtime.cn/Video/2019/03/21/mp4/190321153853126488.mp4',
          }
        ]});

showVipView

vip界面显示

示例代码

var ox = this.$refs.video;
ox.showVipView();

hideVipView

vip界面隐藏

示例代码

var ox = this.$refs.video;
ox.hideVipView();

seekTo

滑到位置播放

示例代码

var ox = this.$refs.video;
ox.seekTo(1200);

setSpeed

设置倍速

示例代码

var ox = this.$refs.video;
ox.setSpeed(1.5);

setVolume

设置声音

示例代码

var ox = this.$refs.video;
ox.setVolume(1.5);

setMuted

是否静音

示例代码

var ox = this.$refs.video;
ox.setMuted(true);

enterFullScreen

进入全屏

示例代码

var ox = this.$refs.video;
ox.enterFullScreen();

exitFullScreen

退出全屏

示例代码

var ox = this.$refs.video;
ox.exitFullScreen();

addDanmaku

添加弹幕

示例代码

var ox = this.$refs.video;
ox.addDanmaku({text:'测试',isSelf:true});

next

播放下一条记录

示例代码

var ox = this.$refs.video;
ox.next();

prev

播放上一条记录

示例代码

var ox = this.$refs.video;
ox.prev();

playIndex

播放索引视频

示例代码

var ox = this.$refs.video;
ox.playIndex(2);

start

开始播放

示例代码

var ox = this.$refs.video;
ox.start();

pause

停止播放

示例代码

var ox = this.$refs.video;
ox.pause();

replay

重新播放

示例代码

var ox = this.$refs.video;
ox.replay();

remove

移除播放器

示例代码

var ox = this.$refs.video;
ox.remove();

showPlay

显示播放器

showPlay()

示例代码

var ox = this.$refs.video;
ox.showPlay();

hidePlay

隐藏播放器

hidePlay()

示例代码

var ox = this.$refs.video;
ox.hidePlay();

clearCache

清理缓存

clearCache();

示例代码

var ox = this.$refs.video;
ox.clearCache();

## 可用性

showSelectView

显示选举界面

showSelectView();

示例代码

var ox = this.$refs.video;
ox.showSelectView();

## 可用性

showSpeedView

显示倍速界面

showSpeedView();

示例代码

var ox = this.$refs.video;
ox.showSpeedView();

## 可用性

enterTinyWindow

显示小屏

enterTinyWindow();

示例代码

var ox = this.$refs.video;
ox.enterTinyWindow({x:0,y:0});

## 可用性

隐私、权限声明

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

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

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

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