scrollVideo

来自于：开发者立即使用

addEventListener openScrollVideo hideScrollVideo showScrollVideo closeScrollVideo updateVideoStyle addVideoData pause play isPlaying itemCount getDuration getCurrentPosition setVolume delCurrentItem

论坛示例

为帮助用户更好更快的使用模块，论坛维护了一个示例，示例中包含示例代码供您参考。

概述

scrollVideo模块用ijkplayer封装在iOS、Android下仿抖音上下滑动播放视频功能(列表图片加载会存在延迟，可能会出现黑屏，属于正常现象，后续优化)。

固件要求

Android：4.0及以上 iOS：8.0及以上

模块接口

addEventListener

滑动播放器监听

addEventListener(callback(ret))

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true,      //布尔型；true||false
  3.     evenType : 'onPageSelected'//当前播放页:onPageSelected
  4.                     //播放错误:onErrorVideo
  5.                     //缓冲开始:onBufferingStart
  6.                     //缓冲结束:onBufferingEnd
  7.                     //单击事件:onSingleTapUp
  8.                     //双击事件:onDoubleTap
  9.                     //长按事件:onLongPress
  10.                     //按钮点击事件:onBtnClick
  11.                     //文字点击事件:onTextClick
  12.                     //大小播放器切换事件:onSwitchPlayer
  13.                     //视频准备成功事件:onPrepared
  14.                     //向左滑过事件:onMoveLeft
  15.                     //向右滑过事件:onMoveRight
  16.     xh : 0, //播放页序号
  17.     itemData : {..},//当前item的json内容
  18.     clickData:{...}//对应按钮或者文字的json内容。
  19. }

示例代码

  1. var demo = api.require('scrollVideo');
  2. demo.addEventListener(function(ret, err){
  3.     alert(JSON.stringify(ret));
  4. });

可用性

iOS、Android系统

可提供的1.0.0及更高版本

openScrollVideo

打开滑动播放器

openScrollVideo({params}, callback(ret,err))

params

rect：

  • 类型：JSON 对象
  • 描述：（必填项）模块的位置及尺寸
  • 内部字段：
  1. {
  2.     x: 0,   //（必填项）数字类型；模块左上角的 x 坐标（相对于所属的 Window 或 Frame）；默认值：0
  3.     y: 0,   //（必填项）数字类型；模块左上角的 y 坐标（相对于所属的 Window 或 Frame）；默认值：0
  4.     w: 320, //（必填项）数字类型；模块的宽度；默认值：所属的 Window 或 Frame 的宽度
  5.     h: 250  //（必填项）数字类型；模块的高度；默认值：所属的 Window 或 Frame 的高度
  6. }

fixedOn：

  • 类型：字符串
  • 描述：（可选项）模块所属 Frame 的名字，若不传则模块归属于当前 Window

fixed：

  • 类型：布尔
  • 描述：（（可选项）模块是否随所属 Window 或 Frame 滚动
  • 默认值：true（不随之滚动）

userData：

  • 类型：JSON 对象
  • 描述：（必填项）视频播放列表（最少传入1条记录）。
  1. {
  2.     uid: '',   //（必填项）播放ID
  3.     imageUrl: '',   //（可选项）播放前的预览图片
  4.     placeholderColor: '#DDDDDD',   //（可选项）背景图颜色，默认值:黑色
  5.     placeholderImage: 'widget://image/musiclist_img_item_music_bg.png',   //（可选项）背景图未加载时显示的图片,当该值存在时，placeholderColor无效
  6.     imageType : 0,//0:图片拉伸填充(图片可能会变形) 1:图片拉伸至完全显示(图片不会变形) 2:图片拉伸至完全铺满填充(图片不会变形)
  7.     scalingMode : 4,//(可选选)视频播放显示铺满模式(详细描述见接口addVideoData文档)
  8.     isLocalCache : true, //(可选项)是否本地缓存视频,音频
  9.     styles : [{
  10.        type : 'button',// 按钮类型:button,text,music(带动画的音乐按钮),autoText(跑马灯)
  11.        x : 0, //按钮x坐标
  12.        y : 0, //按钮y坐标
  13.        w : 0, //按钮宽度
  14.        h : 0, //按钮高度
  15.        pic : 'widget://image/gif1.gif',//按钮图片路径;音乐按钮背景图（支持路径fs:// widget:// 类型：png gif ）
  16.        pic1 : 'widget://image/gif1.gif',//音乐按钮中间logo图片路径（支持路径fs:// widget:// 类型：png gif ）
  17.        isRadius : false,//是否进行圆形图片按钮处理;音乐按钮是否开启动画，默认:false
  18.        lineColor : '',//设置描边颜色,默认无
  19.        text : '测试',//文本内容
  20.        textSize : 12, //字体大小
  21.        textColor : '',//字体颜色
  22.        gravity : 0,// 文字位置 0:center 1 : left 2 :right (水平)
  23.        vertical : 0,// 文字位置 0:top 1 : middle 2 :bottom (垂直)
  24.        name : '',按钮名称
  25.     }]
  26. }

position：

  • 类型：数字型
  • 描述：（可选项）指定从播放列表中的第几条开始播放。
  • 默认值：0

callback(ret,err)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true,      //布尔型；true|false
  3. }

err：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     msg : ''
  3. }

示例代码

  1. var demo = api.require('scrollVideo');
  2. demo.openScrollVideo({
  3.     rect : {
  4.         x : 0,
  5.         y : 150,
  6.         h : 400
  7.     },
  8.     userData : [{
  9.         uid : new Date().getTime()+1,
  10.         imageUrl :'http://7z2dc9.com1.z0.glb.clouddn.com/apicloud/bc281dfcaf750de7acd9c8e9224e237b.png',
  11.         videoUrl : 'http://7z2dc9.com1.z0.glb.clouddn.com/apicloud/abb9595e74647defe21d748e12f7a7c9.mp4',
  12.     },{
  13.         uid : new Date().getTime()+2,
  14.         imageUrl :'http://7z2dc9.com1.z0.glb.clouddn.com/apicloud/1a73dd6a90a52b2aad1aafefbf977e4c.png',
  15.         videoUrl : 'http://7z2dc9.com1.z0.glb.clouddn.com/apicloud/00b2141bff87cfaa75498f66214aeb9e.mp4',
  16.     },{
  17.         uid : new Date().getTime()+3,
  18.         imageUrl :'http://7z2dc9.com1.z0.glb.clouddn.com/apicloud/ec65083dbdc6bb18a6318591ac6c15a5.png',
  19.         videoUrl : 'http://7z2dc9.com1.z0.glb.clouddn.com/apicloud/9d9906ba474152307d7edca6bd72fbe2.mp4',
  20.     },{
  21.         uid : new Date().getTime()+4,
  22.         imageUrl :'http://7z2dc9.com1.z0.glb.clouddn.com/apicloud/51fc1ddde9790c96a6986b74342a15e3.png',
  23.         videoUrl : 'http://7z2dc9.com1.z0.glb.clouddn.com/apicloud/dc811d2c4d88b409063c7ea2065fe6a0.mp4',
  24.     },{
  25.         uid : new Date().getTime()+5,
  26.         imageUrl :'http://7z2dc9.com1.z0.glb.clouddn.com/apicloud/51fc1ddde9790c96a6986b74342a15e3.png',
  27.         videoUrl : 'http://7z2dc9.com1.z0.glb.clouddn.com/apicloud/dc811d2c4d88b409063c7ea2065fe6a0.mp4',
  28.     }],
  29. },function(ret, err){
  30.     alert(JSON.stringify(ret)+"   "+JSON.stringify(err));
  31. });

可用性

iOS、Android系统

可提供的1.0.0及更高版本

hideScrollVideo

隐藏滑动播放器

hideScrollVideo(callback(ret, err))

callback(ret, err)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true,      //布尔型；true||false
  3. }

err：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     msg : ''
  3. }

示例代码

  1. var demo = api.require('scrollVideo');
  2. demo.hideScrollVideo();

可用性

iOS、Android系统

可提供的1.0.0及更高版本

showScrollVideo

显示滑动播放器

showScrollVideo(callback(ret))

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true,      //布尔型；true
  3. }

示例代码

  1. var demo = api.require('scrollVideo');
  2. demo.showScrollVideo(function(ret){
  3.     alert(JSON.stringify(ret));
  4. });

可用性

iOS、Android系统

可提供的1.0.0及更高版本

closeScrollVideo

关闭滑动播放器

closeScrollVideo(callback(ret, err))

callback(ret, err)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true,      //布尔型；true||false
  3. }

err：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     msg : ''
  3. }

示例代码

  1. var demo = api.require('scrollVideo');
  2. demo.closeScrollVideo(function(ret, err){
  3.     alert(JSON.stringify(ret) + "  " +JSON.stringify(err));
  4. });

可用性

iOS、Android系统

可提供的1.0.0及更高版本

updateVideoStyle

更新当前播放器样式

updateVideoStyle({params}, callback(ret,err))

params

styles：

  • 类型：数组 对象
  • 描述：（必填项）当前播放器播放的按钮样式更新。
  1. [{
  2.    type : 'button',// 按钮类型:button,text,music(带动画的音乐按钮),autoText(跑马灯)
  3.    x : 0, //按钮x坐标
  4.    y : 0, //按钮y坐标
  5.    w : 0, //按钮宽度
  6.    h : 0, //按钮高度
  7.    pic : 'widget://image/gif1.gif',//按钮图片路径;音乐按钮背景图（支持路径fs:// widget:// 类型：png gif ）
  8.    pic1 : 'widget://image/gif1.gif',//音乐按钮中间logo图片路径（支持路径fs:// widget:// 类型：png gif ）
  9.    isRadius : false,//是否进行圆形图片按钮处理;音乐按钮是否开启动画，默认:false
  10.    lineColor : '',//设置描边颜色,默认无
  11.    text : '测试',//文本内容
  12.    textSize : 12, //字体大小
  13.    textColor : '',//字体颜色
  14.    gravity : 0,// 文字位置 0:center 1 : left 2 :right (水平)
  15.    vertical : 0,// 文字位置 0:top 1 : middle 2 :bottom (垂直)
  16.    name : '',按钮名称
  17. }]

callback(ret,err)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true,      //布尔型；true|false
  3. }

err：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     msg : ''
  3. }

示例代码

  1. var demo = api.require('scrollVideo');
  2. demo.updateVideoStyle({
  3.     styles : [{
  4.         x : api.frameWidth - 45,
  5.         y : 0,
  6.         w : 40,
  7.         h : 40,
  8.         type : 'button',
  9.         pic : 'widget://image/refresh.png',
  10.         lineColor : '#000000'
  11.     },{
  12.         x : api.frameWidth - 45,
  13.         y : 0 + 40,
  14.         w : 40,
  15.         h : 20,
  16.         type : 'text',
  17.         text : '测1更新样式1',
  18.         textSize : 12
  19.     },{
  20.         x : api.frameWidth - 45,
  21.         y : 60 + 20,
  22.         w : 40,
  23.         h : 40,
  24.         type : 'button',
  25.         pic : 'widget://image/test_uz_icon.png',
  26.         lineColor : '#000000'
  27.     },{
  28.         x : api.frameWidth - 45,
  29.         y : 80 + 40,
  30.         w : 40,
  31.         h : 20,
  32.         type : 'text',
  33.         text : '测2更新样式2',
  34.         textSize : 12
  35.     },{
  36.         x : api.frameWidth - 45,
  37.         y : 120 + 40,
  38.         w : 40,
  39.         h : 40,
  40.         type : 'button',
  41.         pic : 'widget://image/gif1.gif',
  42.     }]
  43. },function(ret,err){
  44.     alert(JSON.stringify(ret,err));
  45. });

可用性

iOS、Android系统

可提供的1.0.0及更高版本

addVideoData

添加一条记录

addVideoData({params}, callback(ret,err))

params

uid：

  • 类型：字符串
  • 描述：（必填项）播放ID

imageUrl：

  • 类型：字符串
  • 描述：（必填项）播放前的预览图片

videoUrl：

  • 类型：浮点型
  • 描述：（必填项）播放的视频地址(支持http,https)

isLocalCache：

  • 类型：布尔型
  • 描述：（可选项）是否本地缓存视频,音频;直播类不能缓存,开发者自行控制;(备注:iOS虽然缓存在本地了,但是不能完全离线播放;缓存文件在cache://文件目录下). (开启:true ; 不开启:false)
  • 默认值：直播:rtmp://开头|rtsp://开头|.m3u8结尾;其余为非直播

scalingMode：

  • 类型：数字型
  • 描述：（可选项）视频播放显示铺满模式（1:无缩放, 2:适应大小模式, 3:充满可视范围，可能会被裁剪, 4:缩放到充满视图）
  • 默认值：4（无缩放）

placeholderColor：

  • 类型：字符串
  • 描述：（可选项）背景图的背景色。
  • 默认值：黑色

placeholderImage：

  • 类型：字符串
  • 描述：（可选项）背景图未加载时显示的图片,当该值存在时，placeholderColor无效。

imageType：

  • 类型：数字型
  • 描述：（可选项）背景图渲染类型 0:图片拉伸填充(图片可能会变形) 1:图片拉伸至完全显示(图片不会变形) 2:图片拉伸至完全铺满填充(图片不会变形)
  • 默认值：0:图片拉伸填充(图片可能会变形)

styles：

  • 类型：数组 对象
  • 描述：（可选项）当前播放器播放的按钮样式更新。
  1. [{
  2.    type : 'button',// 按钮类型:button,text,music(带动画的音乐按钮),autoText(跑马灯)
  3.    x : 0, //按钮x坐标
  4.    y : 0, //按钮y坐标
  5.    w : 0, //按钮宽度
  6.    h : 0, //按钮高度
  7.    pic : 'widget://image/gif1.gif',//按钮图片路径;音乐按钮背景图（支持路径fs:// widget:// 类型：png gif ）
  8.    pic1 : 'widget://image/gif1.gif',//音乐按钮中间logo图片路径（支持路径fs:// widget:// 类型：png gif ）
  9.    isRadius : false,//是否进行圆形图片按钮处理;音乐按钮是否开启动画，默认:false
  10.    lineColor : '',//设置描边颜色,默认无
  11.    text : '测试',//文本内容
  12.    textSize : 12, //字体大小
  13.    textColor : '',//字体颜色
  14.    gravity : 0,// 文字位置 0:center 1 : left 2 :right
  15.    name : '',按钮名称
  16. }]

callback(ret,err)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true,      //布尔型；true|false
  3. }

err：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     msg : ''
  3. }

示例代码

  1. var demo = api.require('scrollVideo');
  2. demo.addVideoData({
  3.     uid : new Date().getTime()+6,
  4.     imageUrl :'http://7z2dc9.com1.z0.glb.clouddn.com/apicloud/51fc1ddde9790c96a6986b74342a15e3.png',
  5.     videoUrl : 'http://7z2dc9.com1.z0.glb.clouddn.com/apicloud/dc811d2c4d88b409063c7ea2065fe6a0.mp4',
  6. },function(ret,err){
  7.     alert(JSON.stringify(ret,err));
  8. });

可用性

iOS、Android系统

可提供的1.0.0及更高版本

pause

暂停当前视频播放

pause(callback(ret,err))

callback(ret,err)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true,      //布尔型；true|false
  3. }

err：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     msg : ''
  3. }

示例代码

  1. var demo = api.require('scrollVideo');
  2. demo.pause(function(ret,err){
  3.     alert(JSON.stringify(ret,err));
  4. });

可用性

iOS、Android系统

可提供的1.0.0及更高版本

play

暂停后恢复播放当前视频

play(callback(ret,err))

callback(ret,err)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true,      //布尔型；true|false
  3. }

err：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     msg : ''
  3. }

示例代码

  1. var demo = api.require('scrollVideo');
  2. demo.play(function(ret,err){
  3.     alert(JSON.stringify(ret,err));
  4. });

可用性

iOS、Android系统

可提供的1.0.0及更高版本

isPlaying

是否播放状态

isPlaying()

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true,      //布尔型；true|false
  3.     isPlaying : true,
  4.     msg : ''
  5. }

示例代码

  1. var demo = api.require('scrollVideo');
  2. var ret = demo.isPlaying();
  3. alert(JSON.stringify(ret));

可用性

iOS、Android系统

可提供的1.0.0及更高版本

itemCount

获取播放item总数

itemCount()

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true,      //布尔型；true|false
  3.     count : 0,
  4.     msg : ''
  5. }

示例代码

  1. var demo = api.require('scrollVideo');
  2. var ret = demo.itemCount();
  3. alert(JSON.stringify(ret));

可用性

iOS、Android系统

可提供的1.0.0及更高版本

getDuration

获取视频的时长

getDuration()

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true,      //布尔型；true|false
  3.     duration : 0,
  4.     msg : ''
  5. }

示例代码

  1. var demo = api.require('scrollVideo');
  2. var ret = demo.getDuration();
  3. alert(JSON.stringify(ret));

可用性

iOS、Android系统

可提供的1.0.0及更高版本

getCurrentPosition

获取已经播放的时长

getCurrentPosition()

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true,      //布尔型；true|false
  3.     currentPosition : 0,
  4.     msg : ''
  5. }

示例代码

  1. var demo = api.require('scrollVideo');
  2. var ret = demo.getCurrentPosition();
  3. alert(JSON.stringify(ret));

可用性

iOS、Android系统

可提供的1.0.0及更高版本

setVolume

设置音量

setVolume({params},callback(ret,err))

params

volume：

  • 类型：数字型
  • 描述：（可选项）播放视频音量0-100。
  • 默认值：0

callback(ret,err)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true,      //布尔型；true|false
  3. }

err：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     msg : ''
  3. }

示例代码

  1. var demo = api.require('scrollVideo');
  2. demo.setVolume({
  3.     volume : 60
  4. },function(ret,err){
  5.     alert(JSON.stringify(ret,err));
  6. });

可用性

iOS、Android系统

可提供的1.0.0及更高版本

delCurrentItem

删除当前播放item(当删除到最后剩余1条记录的时候就不能删除了)

delCurrentItem(callback(ret,err))

callback(ret,err)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     status: true,      //布尔型；true|false
  3. }

err：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     msg : ''
  3. }

示例代码

  1. var demo = api.require('scrollVideo');
  2. demo.delCurrentItem(function(ret,err){
  3.     alert(JSON.stringify(ret,err));
  4. });

可用性

iOS、Android系统

可提供的1.0.0及更高版本