UIScrollPlayer

来自于：AC模块工作室立即使用

open hide show close add pause play startPlay addEventListener addButtonsListener setCurrButtonVisibility

概述

UIScrollPlayer模块封装了仿抖音上下滑动的播放器

模块接口

open

打开播放器

open({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, // 数字类型；模块的宽度；支持设置'auto'；默认值：所属的 Window 或 Frame 的宽度
  5.     h: 250  // 数字类型；模块的高度；支持设置'auto'；默认值：所属的 Window 或 Frame 的高度
  6. }

videos：

  • 类型：JSON 数组
  • 描述： 视频列表
  1. [{
  2.     imageUrl: '',   //（可选项）播放前的预览图片；默认：模块自带图片；支持网络和本地路径（widget://fs://）
  3.     holderImage:'' //(可选项)播放前预览图片占位图；仅支持widget、fs本地路径
  4.     videoUrl: '',   // 播放的视频地址,支持网络 widget://fs://
  5.     buttons:[      // （可选项）Json数组类型；悬浮在视频上方按钮，不设置则按公共按钮参数显示
  6.     {
  7.         x:,                   //数字类型；按钮相对控件的x坐标
  8.         y:,                   //数字类型；按钮相对控件的y坐标
  9.         w:,                   //数字类型；按钮宽度，默认：100
  10.         h:,                   //数字类型；按钮高度，默认：100
  11.         imgPath:'',           //字符串类型；普通状态按钮图片路径，支持widget、fs、网络路径。注意设置按钮图片的时候不显示标题 ；android 与highlightedImgPath同时设置时网络路径无效
  12.         highlightedImgPath:'',//字符串类型；高亮状态下按钮图片路径，支持widget、fs、网络路径。注意设置按钮图片的时候不显示标题；android 不支持网络路径
  13.         name:'',              //字符串类型；按钮名称，添加点击事件 点击按钮会回调
  14.         styles:{              //json对象，按钮的样式（仅ios支持）
  15.            bgColor: '#fff',        //（可选项）字符串类型；按钮的背景色，支持 rgb、rgba、#；默认：'#fff
  16.            title:'',          //字符串类型，按钮标题，注意设置按钮图片的时候不显示标题    
  17.            highlightedTitle:'',//字符串类型，高亮状态下按钮标题，注意设置按钮图片的时候不显示标题    
  18.            titleSize: 12,     //（可选项）数字类型；按钮标题字体大小；默认：12
  19.            titleColor: '#000',//（可选项）字符串类型；按钮标题字体颜色；默认：#000
  20.            highlightedTitleColor: '#FF0000',//（可选项）字符串类型；高亮状态下按钮标题字体颜色；默认：#FF0000
  21.            borderColor: '#000',          //（可选项）字符串类型；边框颜色，支持 rgb、rgba、#；默认：'#000'
  22.            borderWidth: 0,          //（可选项）数字类型；边框宽度；默认：0
  23.            edge:{             //json对象，标题的边距，负数标题向外移动，正数标题向内移动
  24.              top:0,           //数字类型，标题上边距
  25.              bottom:0,        //数字类型，标题下边距
  26.              left:0,          //数字类型，标题左边距
  27.              right:0          //数字类型，标题右边距
  28.            }
  29.         }
  30.     }],
  32. }]

buttons：

  • 类型：JSON 数组
  • 描述：（可选项）悬浮在视频上方按钮，videos中item中不设置buttons则按此参数展示
  • 内部字段：
  1. [   
  2.     {
  3.         x:,              //数字类型；按钮相对控件的x坐
  4.         y:,             //数字类型；按钮相对控件的y坐标
  5.         w:,            //数字类型；按钮宽度，默认：100
  6.         h:,             //数字类型；按钮高度，默认：100
  7.         imgPath:'',           //字符串类型；普通状态按钮图片路径，支持widget、fs、网络路径。注意设置按钮图片的时候不显示标题 ；android 与highlightedImgPath同时设置时网络路径无效
  8.         highlightedImgPath:'',//字符串类型；高亮状态下按钮图片路径，支持widget、fs、网络路径。注意设置按钮图片的时候不显示标题；android 不支持网络路径
  9.         name:'',              //字符串类型；按钮名称，添加点击事件 点击按钮会回调
  10.         styles:{              //json对象，按钮的样式（仅ios支持）
  11.            bgColor: '#fff',        //（可选项）字符串类型；按钮的背景色，支持 rgb、rgba、#；默认：'#fff
  12.            title:'',          //字符串类型，按钮标题，注意设置按钮图片的时候不显示标题   
  13.            highlightedTitle:'',//字符串类型，高亮状态下按钮标题，注意设置按钮图片的时候不显示标题
  14.            titleSize: 12,     //（可选项）数字类型；按钮标题字体大小；默认：12
  15.            titleColor: '#000',//（可选项）字符串类型；按钮标题字体颜色；默认：#000
  16.            highlightedTitleColor: '#FF0000',//（可选项）字符串类型；高亮状态下按钮标题字体颜色；默认：#FF0000
  17.            borderColor: '#000',          //（可选项）字符串类型；边框颜色，支持 rgb、rgba、#；默认：'#000'
  18.            borderWidth: 0,          //（可选项）数字类型；边框宽度；默认：0
  19.            edge:{             //json对象，标题的边距，负数标题向外移动，正数标题向内移动
  20.              top:0,           //数字类型，标题上边距
  21.              bottom:0,        //数字类型，标题下边距
  22.              left:0,          //数字类型，标题左边距
  23.              right:0          //数字类型，标题右边距
  24.            }
  25.         }
  26. ]

index：

  • 类型：数字
  • 描述：（可选项）页面打开时默认播放视频的下标
  • 默认：0

autoPlay：

  • 类型：布尔
  • 描述：（可选项）视频是否自动播放，设置为false后所有视频都不自动播放
  • 默认值：true（自动播放）

scalingMode：

  • 类型：数字类型
  • 描述：（可选项）视频填充方式
  • 取值范围：1/按视频比例放大缩小至一边充满，2/按视频比例放大缩小至视频充满控件，可能视频会被裁剪，3/宽高充满控件，视频可能会变形
  • 默认值：1

imgScaleType：

  • 类型：数字类型
  • 描述：（可选项）封面图填充方式
  • 取值范围：1/按图片比例放大缩小至一边充满，可能有黑边，图片不变形2/按图片比例放大缩小至图片充满控件，可能图片会被裁剪，图片不变形3/宽高充满控件，图片可能会变形
  • 默认值：3

isLooping：

  • 类型：布尔类型
  • 描述：（可选项）是否循环播放
  • 默认值：true

fixedOn：

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

fixed：

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

callback(ret,err)

ret：

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

err：

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

示例代码

  1. var UIScrollPlayer = api.require('UIScrollPlayer');
  2. UIScrollPlayer.open({
  3.     rect : {
  4.         x : 0,
  5.         y : 150,
  6.         h : 400
  7.     },
  8.     videos : [{
  9.         imageUrl:'',
  10.         videoUrl:'',
  11.     },{
  12.         imageUrl:'',
  13.         videoUrl:'',
  14.     },{
  15.         imageUrl:'',
  16.         videoUrl:'',
  17.     }],
  18. },function(ret, err){
  19.     alert(JSON.stringify(ret));
  20. });

可用性

iOS、Android系统

可提供的1.0.0及更高版本

hide

隐藏播放器

hide()

示例代码

  1. var UIScrollPlayer = api.require('UIScrollPlayer');
  2. UIScrollPlayer.hide();

可用性

iOS、Android系统

可提供的1.0.0及更高版本

show

显示播放器

show()

示例代码

  1. var UIScrollPlayer = api.require('UIScrollPlayer');
  2. UIScrollPlayer.show();

可用性

iOS、Android系统

可提供的1.0.0及更高版本

close

关闭播放器

close()

示例代码

  1. var UIScrollPlayer = api.require('UIScrollPlayer');
  2. UIScrollPlayer.close();

可用性

iOS、Android系统

可提供的1.0.0及更高版本

add

添加视频

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

params

videos：

  • 类型：JSON 数组
  • 描述： 视频列表
  1. [{
  2.     imageUrl: '',   //（可选项）播放前的预览图片
  3.     holderImage:'' //(可选项)播放前预览图片占位图；仅支持widget、fs本地路径
  4.     videoUrl: '',   // 播放的视频地址支持http,https,widget://fs://
  5.      buttons:[      // （可选项）Json数组类型；悬浮在视频上方按钮，不设置则按公共按钮参数显示
  6.     {
  7.         x:,              //数字类型；按钮相对控件的x坐
  8.         y:,             //数字类型；按钮相对控件的y坐标
  9.         w:,            //数字类型；按钮宽度，默认：100
  10.         h:,             //数字类型；按钮高度，默认：100
  11.         imgPath:'',           //字符串类型；普通状态按钮图片路径，支持widget、fs、网络路径。注意设置按钮图片的时候不显示标题 ；android 与highlightedImgPath同时设置时网络路径无效
  12.         highlightedImgPath:'',//字符串类型；高亮状态下按钮图片路径，支持widget、fs、网络路径。注意设置按钮图片的时候不显示标题；android 不支持网络路径
  13.         name:'',              //字符串类型；按钮名称，添加点击事件 点击按钮会回调
  14.         styles:{              //json对象，按钮的样式（仅ios支持）
  15.            bgColor: '#fff',   //（可选项）字符串类型；按钮的背景色，支持 rgb、rgba、#；默认：'#fff
  16.            title:'',          //字符串类型，按钮标题，注意设置按钮图片的时候不显示标题   
  17.            highlightedTitle:'',//字符串类型，高亮状态下按钮标题，注意设置按钮图片的时候不显示标题   
  18.            titleSize: 12,     //（可选项）数字类型；按钮标题字体大小；默认：12
  19.            titleColor: '#000',//（可选项）字符串类型；按钮标题字体颜色；默认：#000
  20.            highlightedTitleColor: '#FF0000',//（可选项）字符串类型；高亮状态下按钮标题字体颜色；默认：#FF0000
  21.            borderColor: '#000',          //（可选项）字符串类型；边框颜色，支持 rgb、rgba、#；默认：'#000'
  22.            borderWidth: 0,          //（可选项）数字类型；边框宽度；默认：0
  23.            edge:{             //json对象，标题的边距，负数标题向外移动，正数标题向内移动
  24.              top:0,           //数字类型，标题上边距；默认：0
  25.              bottom:0,        //数字类型，标题下边距；默认：0
  26.              left:0,          //数字类型，标题左边距；默认：0
  27.              right:0          //数字类型，标题右边距；默认：0
  28.            }
  29.         }
  30.     }],
  31. }]

示例代码

  1. var UIScrollPlayer = api.require('UIScrollPlayer');
  2. UIScrollPlayer.add({
  3.     videos : [{}]
  4. });

可用性

iOS、Android系统

可提供的1.0.0及更高版本

pause

暂停当前视频播放 pause()

示例代码

  1. var UIScrollPlayer = api.require('UIScrollPlayer');
  2. UIScrollPlayer.pause();

可用性

iOS、Android系统

可提供的1.0.0及更高版本

play

暂停后播放视频（iOS此接口只支持暂停后播放视频，若open接口设置autoPlay为fasle或者视频停止后开始播放调用startPlay接口）

play()

示例代码

  1. var UIScrollPlayer = api.require('UIScrollPlayer');
  2. UIScrollPlayer.play();

可用性

iOS、Android系统

可提供的1.0.0及更高版本

startPlay

播放视频

startPlay({params})

params

index：

  • 类型：数字类型
  • 描述：（可选项）播放视频下标

示例代码

  1. var UIScrollPlayer = api.require('UIScrollPlayer');
  2. UIScrollPlayer.startPlay({index:1});

可用性

iOS

可提供的1.0.5及更高版本

addEventListener

滑动播放器监听

addEventListener(callback(ret))

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.     evenType:'onPlaying'
  3.              //未知:onUnknown
  4.              //播放:onPlaying
  5.              //暂停:onPaused
  6.              //停止:onStopped
  7.                //播放错误:onError
  8.               //单击事件:onSingleTapUp
  9.               //双击事件:onDoubleTap
  10.               //滑动事件:onScroll
  11.     index:0  //播放页序号
  12. }

示例代码

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

可用性

iOS、Android系统

可提供的1.0.0及更高版本

addButtonsListener

添加视频悬浮按钮监听事件

addButtonsListener(callback(ret))

callback(ret)

ret：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.    evenType:'',          //字符串类型；事件；内部字段：‘click’/点击
  3.     buttonName:'first',   //字符串类型；buttons中传入按钮名称
  4.     index:0  //播放页序号
  5. }

示例代码

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

可用性

iOS、Android系统

可提供的1.0.2及更高版本

setCurrButtonVisibility

控制当前item中按钮（open接口中传入的buttons）的显示隐藏，

setCurrButtonVisibility(callback(ret))

params

buttonName：

  • 类型：字符串类型
  • 描述： open中传入的按钮name

visibility：

  • 类型：布尔类型
  • 描述：（可选项） 是否显示
  • 默认：true

callback(ret)

ret：

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

err：

  • 类型：JSON 对象
  • 内部字段：
  1. {
  2.   msg:'',         //字符串类型；错误信息
  3. }

示例代码

  1. var UIScrollPlayer = api.require('UIScrollPlayer');
  2. UIScrollPlayer.setCurrButtonVisibility({
  3. buttonName:'',
  4. visibility:false,
  5. },function(ret, err){
  6.     alert(JSON.stringify(ret));
  7. });

可用性

iOS、Android系统

可提供的1.1.2及更高版本