videoPicture

论坛示例

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

概述

videoPicture插件用ijkplayer封装在iOS、Android下带视频播放的轮播功能(本底层是基于ijkplayer,播放类型支持比较多,如果需要轻便的播放器底层(如:仅播放MP4)可以单独联系封装)。

插件使用说明 轮播图片全屏预览有保存按钮,iOS需要申请保存到相册权限,Android需要申请存储权限。

固件要求

Android:4.4及以上 iOS:11.0及以上

插件接口

openCarousel

打开轮播播放器

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

params

rect:

  • 类型:JSON 对象
  • 描述:(必填项)插件的位置及尺寸
  • 内部字段:
{
    x: 0,   //(必填项)数字类型;插件左上角的 x 坐标(相对于所属的 Window 或 Frame);默认值:0
    y: 0,   //(必填项)数字类型;插件左上角的 y 坐标(相对于所属的 Window 或 Frame);默认值:0
    w: 320, //(必填项)数字类型;插件的宽度;默认值:所属的 Window 或 Frame 的宽度
    h: 250  //(必填项)数字类型;插件的高度;默认值:所属的 Window 或 Frame 的高度
}

fixedOn:

  • 类型:字符串
  • 描述:(可选项)插件所属 Frame 的名字,若不传则插件归属于当前 Window

fixed:

  • 类型:布尔
  • 描述:((可选项)插件是否随所属 Window 或 Frame 滚动
  • 默认值:true(不随之滚动)

data:

  • 类型:JSON 对象
  • 描述:(必填项)带视频轮播显示列表。
{
    imageUrl: '',   //(必填项)如果是视频则是播放前的预览图片,图片则是显示图片
    type : 2,//1:视频 2:图片 (如果是带视频的轮播。第一个必须是视频)
    videoUrl: '',   //(可选项)视频类型必填
    scalingMode : 1,//(可选选)视频播放显示铺满模式(1:无缩放, 2:适应大小模式, 3:充满可视范围,可能会被裁剪, 4:缩放到充满视图)
    isLocalCache : true, //(可选项)是否本地缓存视频,音频
}

callback(ret,err)

ret:

  • 类型:JSON 对象
  • 内部字段:
{
    status: true,      //布尔型;true|false
}

err:

  • 类型:JSON 对象
  • 内部字段:
{
    msg : ''
}

示例代码

var demo = api.require('videoPicture');
demo.openCarousel({
    rect : {
        x:30,
        y:400,
        w:300,
        h:200,
        fixedOn:'index_frm', //固定在名为'index_frm'的frame上
        //fixed:false //跟随网页滚动
    },
    data : [{
        imageUrl : 'http://img.ptocool.com/3332-1518523974124-26',
        type : 1,//1:视频 2:图片 如果是带视频的轮播。第一个必须是视频
        videoUrl : 'https://v-cdn.zjol.com.cn/123468.mp4'
    },{
        imageUrl : 'http://img.ptocool.com/3332-1518523974126-29',
        type : 2,
    },{
        imageUrl : 'http://img.ptocool.com/3332-1518523974125-28',
        type : 2,
    },{
        imageUrl : 'http://img.ptocool.com/3332-1518523974125-27',
        type : 2,
    },{
        imageUrl : 'http://img.ptocool.com/3332-1518523974124-26',
        type : 2,
    },{
        imageUrl : 'http://img.ptocool.com/3332-1518523974124-26',
        type : 1,
    }]
}, function(ret, err){
    api.alert({msg: JSON.stringify(ret)});
});

可用性

iOS、Android系统

可提供的1.0.0及更高版本

hideCarousel

隐藏轮播播放器

hideCarousel(callback(ret, err))

callback(ret, err)

ret:

  • 类型:JSON 对象
  • 内部字段:
{
    status: true,      //布尔型;true||false
}

err:

  • 类型:JSON 对象
  • 内部字段:
{
    msg : ''
}

示例代码

var demo = api.require('videoPicture');
demo.hideCarousel();

可用性

iOS、Android系统

可提供的1.0.0及更高版本

showCarousel

显示轮播播放器

showCarousel(callback(ret))

callback(ret)

ret:

  • 类型:JSON 对象
  • 内部字段:
{
    status: true,      //布尔型;true
}

示例代码

var demo = api.require('videoPicture');
demo.showCarousel();

可用性

iOS、Android系统

可提供的1.0.0及更高版本

closeCarousel

关闭轮播播放器

closeCarousel(callback(ret, err))

callback(ret, err)

ret:

  • 类型:JSON 对象
  • 内部字段:
{
    status: true,      //布尔型;true||false
}

err:

  • 类型:JSON 对象
  • 内部字段:
{
    msg : ''
}

示例代码

var demo = api.require('videoPicture');
demo.closeCarousel(function(ret, err){
    alert(JSON.stringify(ret) + "  " +JSON.stringify(err));
});

可用性

iOS、Android系统

可提供的1.0.0及更高版本

是否仍需要帮助? 请保持联络!
最后更新于 2024/05/20